函数

我们之前所涉及到的都是值的标注

函数的标注 会在 值的标注 基础上，对函数本身及其入参、返回值进行标注

函数入参、返回值标注

ts
// 这里标注了入参 name 的类型为 string，返回值类型为 number
function foo(name: string): number {
  return name.length;
}

函数类型签名

在 js 中 可以通过以下方式声明一个函数

• 函数声明：function name(){}

ts
function foo(name: string): number {
  return name.length;
}

• 函数表达式：const foo = function(){}

ts
//方式 1
const foo = function (name: string): number {
  return name.length
}

//方式 2
// 可以像对变量进行类型标注那样，对 foo 这个变量进行类型声明
const foo: (name: string) => number = function (name) {
  return name.length
}

这里的 (name: string) => number 就是 TypeScript 中的函数类型签名

一般我们不会使用 方式 2 去标注函数，因为可读性很差，所以一般会拆分开进行标注

type FuncFoo = (name: string) => number

const foo: FuncFoo = (name) => {
  return name.length
}

函数返回值 void 类型

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

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

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

在 TypeScript 中

• undefined 类型是一个实际的、有意义的类型值
• void 才代表着空的、没有意义的类型值

可选参数与 rest 参数

可选参数 ？

在函数类型中我们也使用 ? 描述一个参数，为可选参数

ts
// 在函数逻辑中注入可选参数默认值
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 参数

rest 参数实际上是一个数组，这里我们也应当使用数组类型进行标注

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

// 或提供详细内容类型
function foo(arg1: string, ...rest: [number, boolean]) { }