ts中的函数

ts中的函数（学习笔记）

基本使用

  function add(a1: string, a2: string): string {
    return a1 + a2;
  }

  const add2 = function (num1: number, num2: number): number {
    return num1 + num2;
  };

  // ts中函数的完整写法
  const add3: (num1: number, num2: number) => number = function (
    num1: number,
    num2: number
  ) {
    return num1 + num2;
  };

函数参数

可选参数

添加：问号？

默认参数

  const add = (num1: number, num2: number = 20, num3?: number) => {

    if (num3 !== undefined) {

      console.log("此时传入了可选参数num3");

    }

    return num1 + num2;

  };

  console.log(add(1)); // 21

给默认参数设置了默认值之后，他其实不传也不会报错了，变为了一个可选参数一样

剩余参数

剩余参数时放在函数声明的时候所有参数的最后

搭配解构赋值使用

  const surplus = (first: string, second: string, ...args: string[]) => {
    console.log(first, second);  // 'a,'d'
    console.log(args); // ['c,'d,'e']
  };

  surplus("a", "b", "c", "d", "e");

函数重载

函数相同，函数的参数及个数不同

  // 重载处理

  function getRe(a: string, b: string): string;
  function getRe(a: number, b: number): number;

  function getRe(a: string | number, b: string | number) {
    if (typeof a === "string" && typeof b == "string") {
      return a + "" + b;
    } else if (typeof a === "number" && typeof b === "number") {
      return a + b;
    }
  }

  console.log(getRe(1, 2)); // 3
  console.log(getRe("hello", "world")); // hello world
  // 此时传入的不是我们想要的数据，ts并没有给我们提示或报错，控制台打印了undefined,这种情况下就用到函数重载了
  console.log(getRe(1, "world")); // undefined  重载处理后，就会报错
  console.log(getRe("hello", 2)); // undefied 重载处理后，就会报错

注意点;重载要写在函数定义前面

需要使用function关键字来定义函数