一文学懂TypeScript的类型

你将学到什么

阅读本文后，你应该能够理解以下代码的含义：

interface Array<T> {  
  concat(...items: Array<T[] | T>): T[];  
  reduce<U>(  
    callback: (state: U, element: T, index: number, array: T[]) => U,  
    firstState?: U): U;  
  ···  
} 

如果你认为这段代码非常神秘 —— 那么我同意你的意见。但是（我希望证明）这些符号还是相对容易学习的。一旦你能理解它们，就能马上全面、精确的理解这种代码，从而无需再去阅读冗长的英文说明。

运行代码案例

TypeScript 有一个在线运行环境。为了得到最全面的信息，你应该在 “Options” 菜单中打开所有选项开关。这相当于在 --strict 模式下运行TypeScript编译器。

关于类型检查的详细说明

我在用 TypeScript 时总是喜欢打开 --strict 开关设置。没有它，程序可能会稍微好写一点，但是你也失去了静态类型检查的好处。目前此设置能够开启以下子设置：

•     --noImplicitAny：如果 TypeScript 无法推断类型，则必须指定它。这主要用于函数和方法的参数：使用此设置，你必须对它们进行注释。
  •   --noImplicitThis：如果 this 的类型不清楚则会给出提示信息。
  •   --alwaysStrict：尽可能使用 JavaScript 的严格模式。
  •   --strictNullChecks：null 不属于任何类型（除了它自己的类型，null），如果它是可接受的值，则必须明确指定。
  •   --strictFunctionTypes：对函数类型更加严格的检查。
  •   --strictPropertyInitialization：如果属性的值不能是 undefined ，那么它必须在构造函数中进行初始化。

更多信息：TypeScript 手册中的“编译器选项”一章。

类型

在本文中，我们把类型看作是一组值的集合。 JavaScript 语言（不是TypeScript！）有7种类型：

•  Undefined：具有唯一元素 undefined 的集合。
•  Null：具有唯一元素“null”的集合。
•  Boolean：具有两个元素 false 和 true 的集合。
•  Number：所有数字的集合。
•  String：所有字符串的集合。
•  Symbol：所有符号的集合。
•  Object：所有对象的集合（包括函数和数组）。

所有这些类型都是 dynamic：可以用在运行时。

TypeScript 为 JavaScript 带来了额外的层：静态类型。这些仅在编译或类型检查源代码时存在。每个存储位置（变量或属性）都有一个静态类型，用于预测其动态值。类型检查可确保这些预测能够实现。还有很多可以进行 静态 检查（不运行代码）的东西。例如，如果函数 f(x) 的参数 x 是静态类型 number，则函数调用 f('abc') 是非法的，因为参数 'abc' 是错误的静态类型。

类型注释

变量名后的冒号开始 类型注释：冒号后的类型签名用来描述变量可以接受的值。例如以代码告诉 TypeScript 变量 “x” 只能存储数字：

let x: number; 

你可能想知道用 undefined 去初始化 x 是不是违反了静态类型。 TypeScript 不会允许这种情况出现，因为在为它赋值之前不允许操作 x。

类型推断

即使在 TypeScript 中每个存储位置都有静态类型，你也不必总是明确的去指定它。 TypeScript 通常可以对它的类型进行推断。例如如果你写下这行代码：

let x = 123; 

然后 TypeScript 会推断出 x 的静态类型是 number。

类型描述

在类型注释的冒号后面出现的是所谓的类型表达式。这些范围从简单到复杂，，并按如下方式创建。

基本类型是有效的类型表达式：

•  对应 JavaScript 动态类型的静态类型：   

- `undefined`, `null`  
   - `boolean`, `number`, `string`  
   - `symbol`  
   - `object` 

•   注意：值 undefined 与类型 undefined（取决于所在的位置）
•  TypeScript 的特定类型：
  •   Array（从技术上讲不是 JS 中的类型）
  •   any（所有值的类型）
  •   等等其他类型

请注意，“undefined作为值“ 和 ”undefined作为类型” 都写做 undefined。根据你使用它的位置，被解释为值或类型。 null 也是如此。

你可以通过类型运算符对基本类型进行组合的方式来创建更多的类型表达式，这有点像使用运算符 union（∪）和intersection（∩）去合并集合。

下面介绍 TypeScript 提供的一些类型运算符。

数组类型

数组在 JavaScript 中扮演以下两个角色（有时是两者的混合）：

•  列表：所有元素都具有相同的类型。数组的长度各不相同。
•  元组：数组的长度是固定的。元素不一定具有相同的类型。

数组作为列表

（编辑：南平站长网）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!