【学习笔记】TypeScript 函数-一一网

1 函数

函数有两种类型：

命名函数

function add(num1: number, num2: number): number {
    return num1 + num2
}
复制代码

匿名函数

let add: (num1: number, num2: number) => number = function(num1, num2) {
    return num1 + num2
}
复制代码

2 函数类型

函数类型包含2个部分：

参数类型
返回值类型

ts中完整的函数形式是包含参数类型和返回值类型：

let myAdd: (x: number, y: number) => number = function(x: number, y: number): number { return x + y; };
复制代码

2.1 推断类型

在赋值语句左边指定了类型，右边没有指定类型会自动推断出参数类型和返回值类型。

3 可选参数和默认参数

TS 默认情况是要求函数参数都是必须的，即函数调用时必须为每个参数都传入值。

JS 中参数是可选，如果不传入对应参数的值，则该参数值默认是 undefined 。

3.1 可选参数 `?`

TS 中使用 ? 跟在参数名后名，表示该参数是可选的，可选参数必须在所有必须参数的后面。

function getFullName(firstName: string, lastName?: string) {
   return firstName + lastName
}
getFullName('Jhon') // 正确
getFullName('Jhon', 'Smith') // 正确
复制代码

3.2 默认参数

function getFullName(firstName: string, lastName = 'Smith') {
   return firstName + lastName
}
getFullName('Jhon') // 正确
getFullName('Jhon', 'Smith') // 正确
复制代码

特点：

默认参数不需要放在必须参数后面

这样的默认参数在使用时可传入 undefined 使其默认值生效。

所有必须参数后面的默认参数都是可选的

也就是说可选参数与末尾的默认参数共享参数类型。

function getFullName(firstName: string, lastName?: string) { // }
function getFullName(firstName: string, lastName = 'Smith') { // }
复制代码

上述两个函数共享同一个函数类型：

(firstName: string, lastName?: string) => string
复制代码

4 剩余参数 `...rest`

必须参数、默认参数和可选参数都表示的是某一个参数。

JS 中使用 arguments 来获取所有参数，也可以使用剩余变量...rest来获取剩余参数列表，其中rest表示的是剩余参数变量。

在TS中，同样可以使用剩余参数变量获取剩余的参数。

特点：

表示：...rest，其中 rest 是剩余参数变量名，可以是任意的名字。
剩余参数变量是一个数组类型

function getFullName(firstName: string, ...restOfName: string[]): string {
    return firstName + restOfName.jon(' ')
}

// 函数类型
let myFullName: (firstName: string, ...resetOfName: string[]) => string = getFullName
复制代码

5 `this`

JS 中，this 只有在函数被调用时才指定。

ES6中，使用箭头语法来创建函数时，this 在函数创建时就指定了，而不是在调用时指定。

6 重载

JS 中函数会根据不同的参数类型来返回不同的值。

TS 中为同一个函数提供不同的函数类型定义来进行函数重载。

function pickCard(x: {suit: string; card: number; }[]): number
function pickCard(x: number): {suit: string; card: number; }

function pickCard(x): any {
    if (typeof x == "object") {
        let pickedCard = Math.floor(Math.random() * x.length); 
        return pickedCard; 
    } 
    else if (typeof x == "number") {
        let pickedSuit = Math.floor(x / 13);
        return { suit: suits[pickedSuit], card: x % 13 }; 
    } 
}
复制代码