当前位置：首页 > article >正文

TypeScript（六）函数

article 2025/1/12 18:15:05

前言

可选参数

参数默认值

剩余参数

类型推断

函数重载

结尾

参考文章

前言

在前面的文章中，我使用对象类型以及接口分别定义了函数类型，浅谈了函数的定义及基本使用。本文将分享函数的进阶用法

可选参数

函数参数可以被标记为可选的，这意味着在调用函数时可以省略这个参数。要使参数成为可选参数，写法与接口的可选属性一样，在参数名后面加上一个问号?

function foo(params?: string): void {
    console.log(params)
}

需要注意的是，必选参数不能位于可选参数后，下面代码会提示错误

function foo(params?: string, params2): void {
    console.log(params, params2)
}

正确写法

function foo(params2, params?: string): void {
    console.log(params, params2)
}

参数默认值

参数默认值是在函数声明时可以为函数参数指定一个默认值，当传入的实参为空时使用该值

function foo(params?: string, params2: string = "hello"): void {
    console.log(params, params2)
}

此时函数中被赋予参数默认值的参数也建议放在最后（一般接入sonar会提示）

function foo(params2: string = "hello", params3: string): void {// 不推荐
    console.log(params2, params3)
}
function foo2(params3: string, params2: string = "hello"): void {// 建议这么写
    console.log(params2, params3)
}

剩余参数

剩余参数实际是JS中的语法，在ES6之前，使用function关键字声明函数一般使用arguments获取参数类数组，在ES6的结构赋值和箭头函数出现后，一般使用 ...args 获取函数剩余参数或所有参数

function foo(...args): void {
    console.log(...args, ...arguments)// a b c a b c
}
foo("a", "b", "c")

类型推断

TypeScript中函数可以自动推断返回值类型，比如

function foo(num: number, num2: number) {
    return num + num2
}

上述代码会根据想加逻辑将返回值推断为number

function foo(num: number, num2: number): number

函数重载

函数重载是TS中十分重要的特性，它允许我们针对同一个函数名定义多种参数及返回值类型；在调用时会根据传入的参数类型和返回值类型来自动选择正确的函数；函数重载的写法与接口和对象之间的关系有点相似：定义抽象的函数声明，使用函数将其实现。

function foo(num: number, num2: number): number
function foo(str: string): string
function foo(str: number | string, num2?: number) {
    return typeof str === "string" ? str : str + num2
}

上述例子是一个简单的函数重载，我定义了两个函数待实现，如果第一个参数类型是string则直接返回，否则返回参数之和