在这个TypeScript教程中，会为您提供了一个非常详细和深入介绍流行的JavaScript变体。 现在，让我们从TypeScript的基础知识开始，作为JavaScript的超集以及最近添加的输入功能。

2016年9月中旬，TypeScript 2.0版发布，这是JavaScript超集历史上的里程碑事件，也是一个更加精致和复杂的产品。 它的细化可以通过可能最重要的特征来表达，即可选的静态类型。

根据项目经理Anders Hejlsberg的说法，这些实现使开发人员能够在JavaScript开发方面进行更大规模的开发。 该语言具有开源历史; 自2012年以来一直受到社区发展的影响，今后仍然可能还会继续。 它使用ECMAScript 3的编译功能，但也可以选择性地将其转换为新版本的ECMAScript，因此可以保证所有浏览器都能使用JavaScript。 最后，这个软件包是通过工具完成的，它很好地融入了Node.js和npm的生态系统中。

已建立的IDE和编辑可以从TypeScript编译器体系结构中获益，该编译器体系结构允许插件使用代码完成和重构功能。 更重要的是，现在有可能用现有的工具处理更大的JavaScript代码库。 即使是行业巨头谷歌也使用TypeScript作为他们流行的框架Angular，这意味着项目的长期使用寿命。 现在让我们继续讨论TypeScript的主要特性，即可选的静态类型。 该功能提供了一系列基本类型，清单1中显示了这些基本类型，如下所示：

除了经典的布尔值布尔值，字符串的字符串和数值的数字（十进制，十六进制，二进制和辛烷格式）之外，还可以用两种不同的方式来表示数组：以一种非常传统的方式， 由具有以下字符串的数组构成的示例：

让aArray：string [] = ['Hello'，'World'，'！'];

或与泛型：

让aArray：Array = ['Hello'，'World'，'！'];

最后一个基本类型之一是枚举，它可以用来定义枚举。 它以从0开始的升序进行设置。或者，可以分配数值本身。

从JavaScript迁移到TypeScript有时会导致错误的发生。 这涉及代码库的类型以及未清楚解决的类型的特殊情况。 还有一些简化与JavaScript集成的特殊类型。 清单2首先显示了任何类型，只要变量具有不同类型的值，就可以使用它。

数组也可以包含不同的类型，如let tuple：[string，number] ;. 应该注意的是，一个序列与此相关联，并且从索引2起，这两种类型中的每一种都是允许的。 因此下列分配是正确的：

tuple = [“Hello”，42];

tuple = [“Hi”，42，27，“Zoe”];

2.0版引入了从不使用的新类型，如果方法根本不终止，则使用该类型。 它经常发生这个过程与void相混淆，如果一个方法不产生任何结果，这就适用。 清单3中的方法总是抛出一个错误，所以它不能正确终止。 由于这个原因，它被分配了返回值，即所谓的底层类型从不表示这种行为。 这也可以用于执行运行时和编译检查，检查这种行为。 你可以在这里找到更详细的解释。

TypeScript：为什么你现在应该得到它！

购买TypeScript的最佳参数是可选的静态类型。 事实上，它非常精致，编译器非常可靠且快速。 此外，可以通过使用接口轻松创建类型。 清单4展示了这种机器人界面。 它可以包含属性和功能签名。 所谓的可选属性是一个特殊功能。 就像propertymodel一样，它们标有？ 它们可以以具体形式存在或不存在。

然后一个类可以实现这个接口，编译器检查合同是否被遵守。 这显示了使用静态类型的巨大优势，因为如果您拥有相当庞大的代码库，这非常困难，并且可能无法保证只通过高测试覆盖来达到合规性。 另一方面，TypeScript在其编译器中配备了一个安全网，特别是对于这种情况。 C3PO类是一个有效的实现，尽管缺少可选的属性模型，并且已停止使用。

更有趣的是，可能会出现这种情况，即属性可能会丢失，但不应该超过它们来实现接口。 以下代码无效：

let wrongC3PO：Robot = {name：'Falsum'，sayName：function（）{}，excess：true};

对于一个真正的面向对象，一个关键特征仍然缺失; 数据封装。 为此，TypeScript包含public，protected，private和readonly的修饰符（清单6），其中一些从其他语言中已知。 前三个行为就像你从Java这样的语言期望的那样。 只有受保护的软件包可见性，行为不同，因为JavaScript中缺少软件包结构。 只有从类继承的子类才能访问标记为受保护的属性。 只读修饰符与其他语言中的最后一个对应。 readonly提供的属性只能在创建对象时设置一次。

使用TypeScript进行打字的特点

TypeScript的类型系统基本上不是“健全”的构建。 这意味着在特殊情况下它不会生成错误，因为它在编译运行时不能确定正确的输入。 这与JavaScript的性质有关，它经常利用这种特殊情况。 有关这些情况的更详细的解释，请参阅。 否则，类型系统有四个属性（清单8），这些属性也是可选的。

如果不使用键入，编译器不会“抱怨”。 结合其结构类型，确实存在相当不错的副作用：编译器几乎可以在所有情况下正确地派生类型。 这个属性也被称为鸭子打字。 本地类型推断也很有趣而且非常强大。 如果新创建的对象被分配给非类型变量，例如 withc3po = new C3PO（'c1po）;那么编译器通常已经知道c3po确实包含了一个C3PO类型的对象。 最后一个属性是上下文键入。 在这种情况下，编译器可以根据情况确定类型。 因此它知道在窗口中。 onmousedown，将鼠标事件传递给具有（不）某些属性的函数（清单7）。

当wedoneed函数类型

JavaScript一直是一种功能性语言，并且仅为函数引入类型才是合乎逻辑的。 这些甚至可以通过一个接口在TypeScript中定义（清单8）。 参数列表在括号中给出，然后是返回类型。 void类型表示函数没有返回值。 如果您没有浏览界面，请使用Fat Arrow中的符号：（p1，p2，...）=> T ...。 当在代码库中使用回调函数或通常在功能上对回调函数进行编程时，函数类型特别有用。 这两种情况通常在JavaScript代码库中都有异步调用。

有关类型定义的几句话

在TypeScript中，可以同时用静态和实例部分描述接口。 这听起来令人困惑，事实上，即使手册也没有提供澄清。 我们来看清单9中的例子。接口在实例端定义了一个属性age。 在静态方面，构造函数使用关键字new定义。 Mortal类实现了接口，但由于编译器无法找到新的方法，因此出现错误。 为什么会发生这种情况，尽管有一个构造函数包含必要的签名？

如果你使用let aMortal = new Mortal（42）创建对象，则构造函数被调用，但由于它不再作为对象的方法存在，因此不再可访问。 像马尔蒂尔纽（42）这样的呼叫因此不再可能。 尽管如此，接口MortalInterface要求存在这种方法。 接口只应描述实例页面或静态页面。 仍然有可能，两者都显示在一起，但编译器只检查实例页面 - 然后不可能实现满足这些要求的类。

静态页面的定义只有在构建Factory时才有意义。 清单10定义了两个接口，这些接口用于构造类Human的对象。 HumanConstructor描述了构造函数的签名; HumanInterface描述了应该包含在对象本身中的属性。 现在，如果你想创建一个具体类Human，它实现了InstanceInterface HumanInterface，并且它必须像HumanConstructor一样被赋予相同的构造器。

工厂方法createHuman需要一个对象，它符合HumanConstructor的构造函数的规范，并作为回报输出HumanInterface类型的对象，并且您拥有该对象 - 静态和实例的页面都已合并。

用泛型参数化类和方法

泛型通常用于使用类型对类和方法进行参数化。 这样，就可以向编译器报告数组中包含的元素的类型。

排列

这对于开发人员非常有用，因为类型检查在编译期间已经发生。 另外，包含元素的类型是已知的，可用于智能感知。 以下示例显示了一个正在参数化方法的情况。 这个想法源自一个博客，并且已经被改编和修正，以供我们在这里使用。 清单11通过所谓的变量类型T（拼写）实现了一个通用函数，它对API进行异步调用。

返回类型被定义为承诺，最终应该输出JSON。由于JavaScript中的对象实际上都是JSON格式的 - 因此名称为JavaScript对象表示法 - 返回值可以转换回给定的类型。这与钻石运营商合作：

response.json（）

不幸的是，这里存在问题，因为参考参数arg不受限制。因此，编译器无法确定arg是否具有属性ID。该类型是解决任何。正是在这里，应用了通用约束条件。为此，我们将设置一个新的接口标识，其中包含一个属性ID：

接口标识{id：string; }

getAsync（）的签名被扩展，最终看起来像这样：

函数getAsync（arg：T）：Promise

这对开发人员有什么帮助？由于可以使用getAsync（）方法进行参数化

类型变量，可以向API发送一个任意的请求，然后返回指定类型的对象。清单12中可以看到整个示例。

“Movie”类确实实现了前面讨论的Interface Identity，因此可以用作getAsync（）的Type-Variable。 使用Movie作为类型变量和影片对象参数的getAsync（）调用确实会导致类型信息稍后在随后的块中可用。 开发人员可以完全访问IntelliSense，因为电影不属于任何类型，但是类型为Movie。

ECMAScript 20XX

除了可选的静态类型外，TypeScript还可以通过ECMAScript 3/5转换为更早的JavaScript语言功能。 本文仅展示一些最受期待的ECMAScript-2016/17语言功能，这些功能已在TypeScript中提供。 如果您希望更准确地了解等待您的内容，您会在此处找到详细的概述。 这一切都始于装饰器，它将在ECMAScript 2018中得到完全支持。装饰器是简单的函数，它们具有参数目标，名称和描述符。 清单13显示了一个简单的Decorator日志，用于装饰类的方法。

不能装饰课外的功能。如果您创建了Greeter类型的对象

有：

var greeter = new Greeter（）;

然后，您将在控制台显示中看到以下几行内容：

Greeter {}

迎接

对象{

值：[功能：问候]，

可写：真，

enumerable：false，

可配置：true}

这确实开辟了许多新的可能性来影响该方法的处理。这个程序也被推荐用于横截面。除了方法外，课程也可以进行装饰。您可以将单个属性设置为只读，方法是将描述符可写为false。正如你所看到的，可能性非常大。有关更详细的介绍，您可以按照链接。

另一个预期的功能是异步/等待，它简化了异步功能的工作，特别是Promises。这背后的想法是，编程模型的结构像同步代码，但实际上在后台异步运行。从TypeScript 1.7开始，此功能可用于ECMAScript 2015，因为TypeScript 2.1也可用于ECMAScript 5.现在，让我们来看看清单14中的情景

afunc函数被分配了关键字async。 这是必要的，以便能够使用该功能内的等待。 如果你现在用let res = afunc（）调用afunc; 您将在控制台上看到以下内容：

Hello Zoe和Amelie

如果没有关键字而没有异步/等待工作，控制台的输出将是未定义的，因为不会等待promise的返回值。

结论

在过去的几年中，TypeScript已经成为JavaScript的真正替代品。 用于后端开发人员的JavaScript使用可选的静态类型和快速，智能的编译器进行评分。 另外，通过接口和修饰符可以实现真正的面向对象的开发。

由于这些原因，TypeScript注定要在大型项目中使用。 它通过提供来自未来JavaScript版本的功能进行了四舍五入，其中大部分可以转换为ECMAScript 3/5，因此完全向后兼容JavaScript语言标准。