函数

函数的类型签名

// 函数声明（Function Declaration）
function foo(name: string): number {
  return name.length
}

// 函数表达式（Function Expression）
const foo = function (name: string): number {
  return name.length
}
// 对变量进行类型标注方式进行类型声明
const foo: (name: string) => number = function (name) {
  return name.length
}

// 箭头函数
// 方式一
const foo = (name: string): number => {
  return name.length
}
// 方式二 可读性差
const foo: (name: string) => number = (name) => {
  return name.length
}
// 方式三 使用类型别名将函数声明抽离出来
// 此时 interface 被称为 Callable Interface
type FuncFoo = (name: string) => number
const foo: FuncFoo = (name) => {
  return name.length
}

void 类型

在 TypeScript 中，一个没有返回值（即没有调用 return 语句）的函数，其返回类型应当被标记为 void 而不是 undefined，即使它实际的值是 undefined。

// 没有调用 return 语句
function foo(): void {}

// 调用了 return 语句，但没有返回值
function bar(): void {
  return
}

原因在原始类型、对象类型中讲过，相较于 undefined，void 类型就像是 JavaScript 中的 null 一样。因此在我们没有实际返回值时，使用 void 类型能更好地说明这个函数没有进行返回操作。上面第二个例子中，更好的方式是使用 undefined

function bar(): undefined {
  return
}

可选参数与 rest 参数

在函数类型中也使用 ? 描述一个可选参数：（注意：可选参数必须位于必选参数之后）

// 在函数逻辑中注入可选参数默认值
function foo1(name: string, age?: number): number {
  const inputAge = age || 18 // 或使用 age ?? 18
  return name.length + inputAge
}

// 直接为可选参数声明默认值
// 可选参数与默认值合并就不能够使用 ?
function foo2(name: string, age: number = 18): number {
  const inputAge = age
  return name.length + inputAge
}

对于 rest 参数的类型标注：

function foo(arg1: string, ...rest: any[]) {}

function foo(arg1: string, ...rest: [number, boolean]) {}

foo('Samuel', 18, true)

重载

在某些逻辑较复杂的情况下，函数可能有多组入参类型和返回值类型：

function func(foo: number, bar?: boolean): string | number {
  if (bar) return String(foo)
  return foo * 599
}

如果要实现与入参关联的返回值类型，可以使用 TypeScript 提供的函数重载签名（Overload Signature）