函数

约 771 字大约 3 分钟

2026-02-09

函数签名

函数的类型签名

函数的类型就是描述了函数入参类型与函数返回值类型，可通过类型标注或先声明类型，再实现函数的方式来定义函数类型

类型标注

function sum(a: number, b: number): number {
  return a + b
}

声明类型

type Sum = (a: number, b: number) => number

const sum: Sum = (a, b) => a + b

调用签名

调用签名用于描述 "像函数一样可以被调用的对象"

counter.d.ts

/**
 * Counter 同时具备两种能力
 * 1.有一个 value 属性
 * 2.可以像函数一样被调用
 */
interface Counter {
  value: number
  (step: number): number
}

counter.ts

const counter = ((step: number) => {
  counter.value += step

  return counter.value
}) as Counter

counter.value = 0
counter(2)

构造签名

构造签名（Construct Signature）是指可以被 new 关键字调用的函数签名。可以使用 type、interface 来声明构造签名

type 构造

type PersonConstructor = {
  new (name: string, age: number): Person;
};

interface 构造

interface PersonConstructor {
  new (name: string, age: number): Person;
}

使用

class Person {
  constructor(public name: string, public age: number) {}
}

function createPerson(ctor: PersonConstructor, name: string, age: number) {
  return new ctor(name, age);
}

函数参数

可选参数

可选参数使用 ? 表示，调用时可以不传

function greet(name: string, title?: string) {
  return title ? `${title} ${name}` : name
}

重要

可选参数必须位于必选参数之后

默认参数

默认参数不属于 TypeScript 独有特性，JavaScript 本身就支持。但 TypeScript 可以根据默认参数推导出参数的类型

function greet2(name: string, title = 'Mr.') {
  return `${title} ${name}`
}

Rest 参数

Rest 参数用于接收不定数量的参数，其本质是一个数组

function total(...nums: number[]) {
  return nums.reduce((sum, n) => sum + n, 0)
}

参数解构

函数参数也可以直接解构，并同时标注类型

function printUser({ name, age }: { name: string; age: number }) {
  console.log(name, age)
}

重载

当同一个函数支持多种参数形式，并且返回值会跟着参数变化时，可以使用函数重载

function parse(input: string): number  // 重载签名一
function parse(input: number): string  // 重载签名二

// 函数的实现签名，会包含重载签名的所有可能情况
function parse(input: string | number) {
  if (typeof input === 'string') {
    return Number(input)
  }
  return String(input)
}

笔记

能用联合类型解决时，优先用联合类型；只有返回值和参数类型强相关时，再考虑重载
拥有多个重载签名的函数在调用时，是按照重载的声明顺序往下查找的

this

在普通函数里，TypeScript 可以显式声明 this 的类型，该 this 参数不会出现在真正的调用参数列表中，它只是给 TypeScript 做类型检查用的

function print(this: { name: string }) {
  console.log(this.name)
}

print.call({ name: 'foo' })

this 相关的内置工具

TypeScript 提供了一些工具类型来辅助进行常见的类型转换，这些类型全局可用，关于 this 的有

ThisParameterType<T>：提取函数的 this 类型
OmitThisParameter<T>：移除函数类型中的 this 参数

function foo(this: { token: string }, x: number) {
  return `${this.token}-${x}`
}

type FooThis = ThisParameterType<typeof foo>
type FooWithoutThis = OmitThisParameter<typeof foo>