TypeScript 函数类型

摘要：在本教程中，您将学习 TypeScript 函数类型，它允许您为函数定义类型。

TypeScript 函数类型的介绍

函数类型包含两个部分：参数和返回类型。在声明函数类型时，需要使用以下语法指定这两部分。

(parameter: type, parameter:type,...) => typeCode language: PHP (php)

以下示例展示了如何声明一个变量，该变量具有一个函数类型，该函数类型接受两个数字并返回一个数字。

let add: (x: number, y: number) => number;Code language: JavaScript (javascript)

在这个例子中

• 函数类型接受两个参数：x 和 y，类型为 number。
• 返回值的类型是number，它跟随出现在参数和返回类型之间的胖箭头 (=>)。

请注意，参数名称 (x 和 y) 仅用于提高可读性。只要参数的类型匹配，它就是函数的有效类型。

使用函数类型注释变量后，您可以将具有相同类型的函数分配给该变量。

TypeScript 编译器将参数的数量与其类型和返回类型进行匹配。

以下示例展示了如何将函数分配给 add 变量。

add = function (x: number, y: number) {
    return x + y;
};Code language: JavaScript (javascript)

此外，您可以像这样声明一个变量并将函数分配给变量。

let add: (a: number, b: number) => number =
    function (x: number, y: number) {
        return x + y;
    };Code language: JavaScript (javascript)

在此语法中

• add 是一个变量。
• (a: number, b: number) => number 是函数类型。
• 其余部分是分配给 add 变量的函数。

如果您分配其他类型与 add 变量不匹配的函数，TypeScript 将发出错误。

add = function (x: string, y: string): number {
    return x.concat(y).length;
};Code language: JavaScript (javascript)

在此示例中，我们重新分配了一个类型不匹配的函数到 add 函数变量。

推断函数类型

当您在等式的一侧具有类型时，TypeScript 编译器可以找出函数类型。这种 类型推断 形式称为上下文类型。例如

在此示例中，add 函数将采用类型 (x: number, y:number) => number。

通过使用类型推断，您可以显着减少带注释的代码量。