天天看点

Ts的函数

1. 函数 匿名函数  void无返回值

function f1(): void {
  console.log(1);
}
let f2 = function (): void {
  console.log(1);
}; // 匿名函数

// type 定义类型别名
type F22 = (x: string, y: number) => string;
let f22: F22 = function (a, b) {
  return a + b;
};
let f222: F22 = function (a: string, b: number): string {
  return a + b;
};

type T1 = string | number;
function aa(msg: T1) {
  if (typeof msg === "number") {
    console.log("number");
  } else {
    console.log("string");
  }
}
           

2. 返回值

function f3(): number {
  return 123;
} // 表示number类型返回值 void就是无返回值
           

3. 传参 (要指定类型,每个参数)

function f4(a: number, b: string): string {
  return a + b;
}

console.log(f4(1, "2")); // 12 没有可选参数时,必须都传
           

4. 可选参数 用?表示 表示可以不传此参数,但是可选参数必须放到最后

function f5(a: number, b?: string): string {
  // 这边不能直接 return a + b; 因为b可能不存在
  if (b) {
    return a + b;
  } else {
    return a + "没有定义";
  }
}
console.log(f5(1)); // 1没有定义
console.log(f6(1, "666")); // 1666
           

5.默认参数

function f6(a: number, b: string = "默认"): string {
  return a + b; // 这里b就有了默认值
}
console.log(f6(1)); // 1默认
console.log(f6(1, "666")); // 1666
           

6.剩余参数 用的是...延展符

function f7(a: number, b: number, ...result: number[]): number {
  let sum = a + b;
  result.forEach((n) => {
    sum += n;
  });
  return sum;
}
console.log(f7(1, 2)); // 3
console.log(f7(1, 2, 3)); // 6  result= [3]
console.log(f7(1, 2, 3, 4, 5, 6)); // 21  // result= [3,4,5,6]
           

7.函数重构 方法名相同,参数类型或个数不同 ts的重构是没有方法体的

function f8(a: number): number;
function f8(b: string): string;
function f8(str: any): any {
  if (typeof str === "number") {
    return 123;
  } else {
    return "字符串";
  }
}
console.log(f8(1)); // 123 这里走的是第一个
console.log(f8("测试")); // 字符串 这里走的是第二个

// 参数不同的形式,最后any要兼容
function f9(a: number): number;
function f9(b: string, c: string): string;
function f9(str: any, d?: any): any {
  if (d) {
    return str + d;
  } else {
    return str;
  }
}
console.log(f9(1)); // 1 这里走的是第一个
console.log(f9("测试", "字符")); // 测试字符 这里走的是第二个
           

继续阅读