0005TS函数类型详解

TypeScript 中的函数类型用于为函数定义参数类型和返回值类型。这提供了一个清晰的契约，指明函数应该如何被调用和期望返回什么类型的结果。以下是 TypeScript 中函数类型的一些基本用法和概念：

函数声明

在 TypeScript 中，你可以为函数的参数和返回值指定类型：

function add(x: number, y: number): number {
    return x + y;
}

在这个例子中，x 和 y 都被指定为 number 类型，同时函数的返回类型也被定义为 number。

函数表达式

你也可以在函数表达式中使用 TypeScript 的类型注解：

const add: (x: number, y: number) => number = function(x, y) {
    return x + y;
};
// 当函数作为表达式时，可以通过类似箭头函数形式的语法来为函数添加类型
// 这种形式只适用于函数表达式
const add3: (a: number, b: number) => number = (a, b) => a + b

这里，add 的类型是一个函数类型，这意味着 add 是一个接受两个 number 类型的参数并返回一个 number 类型的结果的函数。

箭头函数

在 TypeScript 中，箭头函数同样可以使用类型注解：

const add: (x: number, y: number) => number = (x, y) => x + y;

这个例子和上面的函数表达式例子类似，但是采用了 ES6 的箭头函数语法。

可选参数和默认参数

TypeScript 允许你指定函数参数为可选的，方法是在参数名后添加一个问号 ?。同时，你也可以为参数提供默认值：

function buildName(firstName: string, lastName?: string): string {
    if (lastName)
        return firstName + " " + lastName;
    else
        return firstName;
}

const result = buildName("John"); // 正确，lastName 是可选的

在这个例子中，lastName 是一个可选参数。

剩余参数

你可以使用剩余参数收集多个参数值到一个变量中：

function buildName(firstName: string, ...restOfName: string[]): string {
    return firstName + " " + restOfName.join(" ");
}

const employeeName = buildName("Joseph", "Samuel", "Lucas", "MacKinzie");

在这个例子中，...restOfName 表示剩余参数，它们被收集到一个名为 restOfName 的数组中。

函数重载

TypeScript 允许函数重载，意味着你可以为同一个函数提供多个函数类型定义：

function pickCard(x: {suit: string; card: number; }[]): number;
function pickCard(x: number): {suit: string; card: number; };
function pickCard(x): any {
    // 实现函数体
}

在这个例子中，pickCard 函数有两个重载：一个接收对象数组，另一个接收数字。根据调用方式的不同，函数返回不同类型的值。

void类型

函数没有返回值，则该类型为void

function sayHello(): void {
  console.log("hello")
}

const sayHello2: () => void = () => {
  console.log("hello2")
}

通过这些示例，你可以看到 TypeScript 中的函数类型是如何提供额外的类型安全性和文档信息的，有助于提高代码的可读性和可维护性。