5.函数扩展

5.函数扩展

1.函数的类型

// 该函数表示调用时需要传递两个参数，第一个参数为字符串类型，第二个参数为数字类型，返回一个字符串类型
const fn = (name: string, age: number): string => {
  return "大家好我是" + name + "," + "今年" + age + "岁";
};
fn("fly", 18);

2.函数的可选参数

// 该函数函数表示调用时，第二个参数可选参数(可传可不传)
const fun = (name: string, age?: number): string => {
  return name + age;
};
fun("fly");

3.函数参数默认值

const fn = (name: string = "我是默认值"): string => {
  return name;
};
console.log(fn()); //我是默认值

4.接口定义函数

//定义一个参数一和参数二都是数字类型，返回参数是数字类型的接口
interface Add {
  (num: number, num2: number): number;
}
const add: Add = (num, num2) => {
  return num + num2;
};
console.log(add(1, 2)); // 3

const fn = (num: number, num2: number): number => {
  return num + num2;
};
fn(10, 5); // 15

// 定义函数参数接口
interface User {
  name: string;
  age: number;
}
function getUserInfo(user: User): User {
  return user;
}
console.log(
  getUserInfo({
    name: "fly",
    age: 18,
  })
);  // { name: 'fly', age: 18 }

5.定义剩余参数

const fn = (array: number[], ...args: any[]): any[] => {
  return args;
};
console.log(fn([11, 2, 3], "4", "5", "6", "7")); //[ '4', '5', '6', '7' ]

6.函数this类型

interface Obj {
  list: Array<number>;
  add: (num:number) => void;
}
let obj: Obj = {
  list: [1, 2, 3],
  add: function (this: Obj,num) {
    this.list.push(num);
    console.log(this.list);
  },
};
obj.add(4) // [ 1, 2, 3, 4 ]

7.函数重载

// 函数重载：由实现函数和重载函数组成，函数名一样，重载函数没有实体，所有逻辑都在实现函数内，实现函数的形参要包括所有重载函数的形参
// 案例：根据不同的参数做不同的操作
let list = [1, 2, 3];
// 重载函数:如给没传参数返回整个数组
function findList(): Array<number>;
// 重载函数:如果参数是数字类型，则查找单个
function findList(id: number): Array<number>;
// 重载函数:如果参数是一个数组，则往数组添加
function findList(add: Array<number>): Array<number>;
// 实现函数
function findList(ids?: number | Array<number>): Array<number> {
  if (typeof ids === "number") {
    return list.filter((item) => ids === item);
  } else if (Array.isArray(ids)) {
    list.push(...ids);
    return list;
  } else {
    return list;
  }
}
console.log(findList()); //[ 1, 2, 3 ]
console.log(findList(2)); // [ 2 ]
console.log(findList([4, 5, 6])); //[ 1, 2, 3, 4, 5, 6 ]