个人笔记-TypeScript中的函数

函数的定义

使用关键字定义

function add1(x: number, y: number) {
    return x + y
}
add1(0, 1);

使用变量定义

let add2: (x: number, y: number) => number
add2 = (x, y) => x + y;
add2(1, 1);

使用类型别名定义

type add_3 = (x: number, y: number) => number
let add3: add_3 = (x, y) => x + y
add3(1, 2);

使用接口定义

interface add_4 {
    (x: number, y: number): number
}
let add4: add_4 = (x, y) => x + y;
add4(2, 2);

TS对函数参数的要求

默认情况

实参和形参必须一一对应，多一个或少一个都不行

可选参数的函数

只有固定个数的参数显然是不可以的，所以我们还需要可选参数

function add5(x: number, y?: number){  // 将y设置为可选参数，并且可选参数顺序上要位于必选参数之后
  return y ? x + y : x;
}
add5(2)
add5(2,3)

剩余参数均为可选参数的函数

function add6(x: number, ...rest: number[]) {
  return x + rest.reduce((pre, cur) => pre + cur)
}
add6(1,2,3,4,5,6,7,8,9) // 45

参数带默认值的函数

function add7(x: number, y = 2, z: number, w = 4) {
  return x + y + z + w;
}
// 必选参数前的参数是不可以省略的 所以这里要传3-4个参数
add7(1, 3, 5) //结果是13  实参3替代了形参的默认值2
// 如果想在必选参数前获取默认值，可以在有默认值参数的位置传入undefined以获取参数默认值
add7(1, undefined, 5) // 结果是12

函数重载

好处：不需要为了具有相似功能的函数选用不同的函数名称，增强函数的可读性

// 先定义一个重载列表 将这个函数最容易匹配到的函数定义放在最前面
function add8(...rest: number[]): number
function add8(...rest: string[]): string
function add8(...rest: any[]): any { // 在类型最宽泛的版本中去实现这个重载
  if(typeof rest[0] === 'string') {
    return rest.join('')
  } else if(typeof rest[0] === 'number') {
    return rest.reduce((pre, cur) => pre + cur)
  }
}
add8(1,2,3)  // 6
add8('a','b','c')  // abc