TypeScript学习5、函数function

函数function

// ES5定义函数
function addArg1(arg1: number, arg2: number) :number {
    return arg1 - arg2
}
//ES6
const addArg2 = (arg1: number, arg2: number) => arg1 + arg2

有时候我们在封装一个函数或者插件时，需要传入一个回调函数，这时我们会对这个回调函数有一定的要求，做一定的限定：

let addArg3 :(x:number, y:number) => number
addArg3 = (arg1: number, arg2: number) => arg1 + arg2 
//addArg3 = (arg1: string, arg2: number) => arg1 + arg2 // error:   不能将类型“number”分配给类型“string”。

当然也可以使用类型别名做限定

type AddArg4 = (x: number, y: number) => number;
let addArg4: AddArg4 = (a, b) => a + b;

或者使用接口

interface AddArg5 {
    (a: number, b:number): number 
}
let addArg5: AddArg5 = (a, b) => a + b

类型别名是早起TypeScript做类型约束的主要形式，后来引入接口之后，TypeScript推荐我们尽可能的使用接口来规范我们的代码。

函数设置默认参数

let addArg6 = (a: number, b: number = 0) => a + b;
console.log(addArg6(4)) //4
console.log(addArg6(4, 1)) //5

设置默认参数可以不指定类型，TS会根据参数默认值的类型进行判断。

let addArg7 = (a: number, b = 0) => a + b;
//console.log(addArg7(4, '3')) //error : 类型“"3"”的参数不能赋给类型“number”的参数

有的时候函数参数个数不一定，我们可以使用ES6的...来处理。

let addArg8 = (a: number, ...b: number[]): void => {
    console.log(b)
} ;
addArg8(1,2,3,4,5,6,7,8,9) //[2, 3, 4, 5, 6, 7, 8, 9]

函数重载： 函数的重载指的是两个以上的函数，具有相同的函数名，但是形参的个数或者类型不同，编译器根据实参和形参的类型及个数的最佳匹配，自动确定调用哪一个函数，这就是函数的重载。

function addArg9 (arg1: string, arg2: string): string;
function addArg9 (arg1: number, arg2: number): number;
function addArg9 (arg1: string | number, arg2: string | number) {
    // 在实现上我们要注意严格判断两个参数的类型是否相等，而不能简单的写一个 arg1 + arg2
    if (typeof arg1 === 'string' && typeof arg2 === 'string') {
        return arg1 + arg2
    } else if (typeof arg1 === 'number' && typeof arg2 === 'number') {
        return arg1 + arg2
    }
}