TypeScript，函数(function)

在 TypeScript 中，function 是用于定义函数的关键字。它具有丰富的语法和功能，允许你声明函数的参数、返回类型以及函数体的实现。以下是一些关于 function 的基本用法和一些高级特性：

基本用法：

1. 函数声明

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

在这个例子中，add 是一个函数，接受两个参数 x 和 y，并返回它们的和。

第三个‘:number’指定了函数的返回类型，表示该函数返回一个 number 类型的值。

2. 箭头函数

const divide = (a: number, b: number): number => a / b;

箭头函数是一种更简洁的函数表达式语法。它自动继承外部作用域的 this，适合在回调函数或短小的函数体中使用。

3. 可选参数和默认参数：

function greet(name: string, greeting?: string): string {
    if (greeting) {
        return `${greeting}, ${name}!`;
    } else {
        return `Hello, ${name}!`;
    }
}

// 调用
console.log(greet("John")); // Hello, John!
console.log(greet("John", "Good morning")); // Good morning, John!

在这个例子中，greeting 参数是可选的，即调用时可以省略。如果不提供 greeting，函数会使用默认的问候语 "Hello"。

‘if (greeting)’ 的目的是检查是否提供了 greeting 参数。如果 greeting 存在（非假值），则执行 if 语句块内的逻辑，返回 ${greeting}, ${name}!。否则，执行 else 语句块内的逻辑，返回 Hello, ${name}!。

4. 函数重载

function combine(a: string, b: string): string;
function combine(a: number, b: number): number;
function combine(a: any, b: any): any {
    return a + b;
}

// 调用
console.log(combine("Hello", " TypeScript")); // Hello TypeScript
console.log(combine(5, 10)); // 15

函数重载允许你为同一个函数提供多个类型的定义，以便根据不同的参数类型执行不同的逻辑。

5. 剩余参数：

function sum(...numbers: number[]): number {
    return numbers.reduce((total, num) => total + num, 0);
}

// 调用
console.log(sum(1, 2, 3, 4, 5)); // 15

‘...numbers: number[]’ 使用了剩余参数语法，表示接受任意数量的参数，并将这些参数存储在名为 numbers 的数组中。

• ‘...numbers’ 这部分使用了扩展运算符 ...，它将函数接收到的所有参数（剩余的参数）收集到一个数组中。在这个例子中，剩余的参数将被收集到名为 numbers 的数组中。

• ‘;number[]’ 这部分是类型注解，指定了 numbers 的类型为 number[]，即 numbers 是一个由数字组成的数组。

最后使用 reduce 方法计算它们的总和。

6. 箭头函数和 this：

箭头函数不会创建自己的 this 上下文，而是捕获其所在的上下文的 this。这在避免传统函数中的 this 指向问题上非常有用。

class Counter {
    value = 0;

    increment = () => {
        this.value++;
        console.log(this.value);
    };
}

const counter = new Counter();
counter.increment(); // 输出：1

在这个例子中，increment 方法是一个箭头函数，它捕获了所在上下文 Counter 实例的 this。

‘= () => { ... }’ 这是箭头函数的语法，表示一个没有参数的箭头函数。箭头函数的主要特点包括：

1. 箭头 ‘=>’ 表示函数的定义。

2. ‘()’ 括号中表示函数的参数列表，这里是空括号，表示该函数没有参数。

3. ‘{ ... }’大括号中包含函数体，即函数要执行的代码。

4. ‘this’指向当前的 Counter 实例，‘this.value’表示初始化了一个名为 value 的成员变量，初始值为 0。‘++’ 这是递增运算符，它将变量的值加一。‘this.value++’ 表示对 this（当前类的实例）的 value 属性进行递增操作，即将 value 的值加一。所以，当调用 counter.increment(); 时，执行了 increment 方法，其中的 this.value++ 将 value 的值从 0 递增到了 1。这样，value 表示了类 Counter 实例的状态，每次调用 increment 方法，它都会递增一次。