【TypeScript教程】05—理解 TypeScript 中的类型注解

英文 | https://www.javascripttutorial.net

翻译 | 杨小爱

在今天的教程中，我们将了解 TypeScript 中的类型注释。

什么是 TypeScript 中的类型注解

TypeScript 使用类型注释来显式指定标识符的类型，例如变量、函数、对象等。

TypeScript 使用语法 : type 在标识符之后作为类型注释，其中 type 可以是任何有效类型。

一旦使用类型注释标识符，它就只能用作该类型。如果标识符被用作不同的类型，TypeScript 编译器将发出错误。

在变量和常量中键入注释

以下语法显示了如何为变量和常量指定类型注释：

let variableName: type;
let variableName: type = value;
const constantName: type = value;

在此语法中，类型注释位于变量或常量名称之后，并以冒号 (:) 开头。

以下示例对变量使用数字注释：

let counter: number;

在此之后，我们只能为计数器变量分配一个数字：

counter = 1;

如果你给 counter 变量赋值一个字符串，你会得到一个错误：

let counter: number;
counter = 'Hello'; // compile error

错误：

Type '"Hello"' is not assignable to type 'number'.

我们既可以对变量使用类型注释，也可以在单个语句中对其进行初始化，如下所示：

let counter: number = 1;

在本例中，我们为计数器变量使用数字注释并将其初始化为 1。

下面显示了原始类型注释的其他示例：

let name: string = 'John';
let age: number = 25;
let active: boolean = true;

在本例中，name 变量获取字符串类型，age 变量获取数字类型，活动变量获取布尔类型。

类型注释示例

数组

要注释我们使用的数组类型，请使用特定类型，后跟方括号：type[] ：

let arrayName: type[];

例如，以下声明了一个字符串数组：

let names: string[] = ['John', 'Jane', 'Peter', 'David', 'Mary'];

对象

要指定对象的类型，请使用对象类型注释。例如：

let person: {
   name: string;
   age: number
};


person = {
   name: 'John',
   age: 25
}; // valid

在此示例中，person 对象仅接受具有两个属性的对象：字符串类型的名称和数字类型的年龄。

函数参数和返回类型

下面展示了一个带有参数类型注解和返回类型注解的函数注解：

let greeting : (name: string) => string;

在此示例中，我们可以将任何接受字符串并返回字符串的函数分配给 greeting 变量：

greeting = function (name: string) {
    return `Hi ${name}`;
};

以下会导致错误，因为分配给 greeting 变量的函数与其函数类型不匹配。

greeting = function () {
    console.log('Hello');
};

错误：

Type '() => void' is not assignable to type '(name: string) => string'. Type 'void' is not assignable to type 'string'.

总结

使用语法 : [type] 的类型注释来显式指定变量、函数、函数返回值等的类型。

推荐阅读

【TypeScript教程】04—为什么选择 TypeScript

【TypeScript教程】03—如何使用 TypeScript 编写" Hello World "程序

【TypeScript教程】02—设置TypeScript

【TypeScript教程】01—什么是 TypeScript？

学习更多技能

请点击下方公众号