TypeScript笔记 - 函数

注解函数

函数需要注解的部分其实只有 参数值 和 返回值

let checkFunc = (str: string): boolean => {
    return str['includes']('a')
}
checkFunc('abc')

使用接口注解函数

使用接口定义函数类型，描述的是一个参数列表 和 返回值类型， 参数列表里每个参数都需要名字和类型

interface CheckFuncConfig {
    // 参数列表    // 返回值
    (str: string): boolean
}

let checkFunc: CheckFuncConfig = (str) => {
    return str['includes']('a')
}
checkFunc('abc')

可选参数

就像接口中可选属性一样，函数也存在可选参数

let people: (name: string, age?: number) {
    // ...
}

参数名和接口定义的可以不一样

对于函数类型的类型检查来说，函数的参数名不需要与接口里定义的名字相匹配，但是会逐个检查，要求对应位置上的参数类型是一样的。

就像下面代码块，上面接口定义的字段是str，但也可以接受成其他字段，比如sss

interface CheckFuncConfig {
     // 参数列表    // 返回值
    (str: string): boolean
}

let checkFunc: CheckFuncConfig = (sss) => {
    return sss['includes']('a')
}
checkFunc('abc')

重载

在 js 里，函数时常会有这种场景：根据传入不同的参数而返回不同类型的数据。

看一下如下例子：传入的如果是字符串，返回参数在名称列表的索引；传入的如果是数字，返回名称列表这个索引位置的数据

let nameList = ['Jane', 'Sasa', 'Aba']

function getName(name): any{
    if(typeof name === 'number'){
        return nameList[name]
    } else if(typeof name === 'string'){
        return nameList.indexOf(name)
    }
}

console.log(getName('Sasa')) // 1
console.log(getName(1)) // Sasa

接下来讨论怎么能在类型系统中，表现这种情况：

类型推断更适用于 参数只有一种类型的情况

在这个例子中，参数有多种参数类型。这时需要用到 函数重载。下面使用这种方法重写上面的例子：

let nameList = ['Jane', 'Sasa', 'Aba']

function getName(name: string): number
function getName(name: number): string
function getName(name): any{
    if(typeof name === 'number'){
        return nameList[name]
    } else if(typeof name === 'string'){
        return nameList.indexOf(name)
    }
}

console.log(getName('Sasa')) // 1
console.log(getName(1)) // Sasa

上面多了两行代码。为getName函数提供两个函数类型定义，每个函数类型定义就是一个重载，这样组成了一个重载列表，编译器会在其中寻找匹配的类型注解。