一文学懂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 中饰演以下两个脚色（偶然是两者的殽杂）：

•  列表：全部元素都具有沟通的范例。数组的长度各不沟通。
•  元组：数组的长度是牢靠的。元素不必然具有沟通的范例。

数组作为列表

（编辑：河北网）

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