原著：丹尼·马尔科夫
翻译：伯乐在线专栏作家-lunarun
关联：
明天我们将了解 TypeScript，这是一种编译为 JavaScript 的编程语言，专为构建小型复杂应用程序的开发人员而设计。 它继承了许多语言的编程思想，例如C#和Java，但与自由风格的JavaScript相比，它增加了更多的规则和约束。
本教程适用于相当精通 JavaScript 但不熟悉 TypeScript 的开发人员。 本教程涵盖了大部分基础知识和主要功能，以及许多带注释的示例来帮助您学习该语言。
开始吧！
使用 TypeScript 的好处
JavaScript 已经很棒了，你可能会想，我真的需要学习 TypeScript 吗？ 从技术角度来看，你不需要学习 TypeScript 就能成为一名优秀的开发人员。 大多数人在不学习 TypeScript 的情况下也能做得很好。 而且，在工作中使用 TypeScript 确实有很多用途：
最后一点（上述原因中）其实对于很多开发者来说是最重要的一点，也是他们对 TypeScript 感兴趣的主要原因。 Angular 2 是当今最流行的框架之一，尽管开发人员可以使用常规 JavaScript，并且大多数教程和示例都是用 TypeScript 编写的。 随着 Angular2 的社区逐渐扩大，越来越多的人会选择 TypeScript。
最近 TypeScript 的受欢迎程度不断上升，数据来自 GoogleTrends。
安装 TypeScript
本教程需要 Node.js 和 Npm。 如果未安装，请单击此处。
安装 TypeScript 最简单的方法是通过 npm。 使用以下命令行，您可以全局安装 TypeScript 包typescript 定义类，然后在所有项目中使用 TypeScript 编译器：
npm 安装 gtypescript
打开终端后，运行tsc -v命令检查TypeScript是否安装正确。
tsc-v
版本1.8.10
支持 TypeScript 的文本编辑器
TypeScript 是一个由 Google 开发和维护的开源项目，因此最初仅由 Google 的 Visual Studio 支持。 如今，有更多的文本编辑器和 IDE 支持 TypeScript 句型、智能提示、纠错，甚至可以本身或通过插件支持外部编译器。
编译为 JavaScript
TypeScript 编写在 .ts 文件（或 JSX 的 .tsx）中，无法直接在浏览器端运行。 它需要首先翻译成 vanilla.js。 这个编译过程可以通过多种方式实现：
我们发现第一种方法是最简单且最适合初学者的方法，因此我们将在整个教程中使用这种技术。
以下命令行将 TypeScript 文件 main.ts 编译为 JavaScript 版本的 main.js。 如果 main.js 已经存在，它将被覆盖。
tscmain.ts
您还可以通过枚举所有文件或使用转义符一次编译多个文件：
#Willresultinseparate.jsfiles：main.jsworker.js。
tscmain.tsworker.ts
#编译当前文件夹中的所有.ts文件。不能递归地工作。
tsc*.ts
当有修改时，还可以使用--watch手动编译成TypeScript文件：
#初始化一个观察程序进程，该进程将保持main.js更新。
tscmain.ts --watch
更多中级 TypeScript 用户还可以创建包含各种构建设置的 tsconfig.json 文件。 由于配置文件是一个手动过程，因此在具有许多 .ts 文件的小型项目中拥有配置文件非常方便。 您可以在此处阅读有关 tsconfig.json 的更多 TypeScript 文档。
静态类型
TypeScript 的一个非常独特的功能是它对静态类型的支持。 这意味着可以声明变量的类型，并且（从而）编译器可以确保形参不会导致类型错误。 如果省略类型声明，TypeScript 将手动从代码中猜测正确的类型。
有一个反例。 任何变量、函数参数或返回值在初始化时都可以定义自己的类型。
varburger:string='汉堡包',//字符串
calcals:number=300,//数字
美味:boolean=true;//布尔值
//或者，您可以省略类型声明：
//varburger='汉堡包';
//该函数期望字符串和整数。
//它不返回任何内容，因此函数本身的类型为void。
函数峰值（食物：字符串，能量：数字）：void {
console.log("我们的"+食物+"有"+能量+"卡路里。");
说话（汉堡，卡路里）；
由于 JavaScript 是弱类型语言（即它不声明变量类型），因此当 TypeScript 编译成 JavaScript 时，所有（变量类型声明）都被删除：
//来自上面 TS 示例的 JavaScript 代码。
varburger='汉堡包',
卡路里=300，
美味=真实；
功能峰值（食物，能量）{
console.log("我们的"+食物+"有"+能量+"卡路里。");
说话（汉堡，卡路里）；
但是，如果我们尝试输入非法句子，tsc 会警告代码中存在错误。 例如：
//给定的类型是布尔值，提供的值是字符串。
vartasty:boolean="我还没有尝试过";
main.ts(1,5)：错误 TS2322：类型“string”不可分配给类型“boolean”。
如果传入错误的函数参数，也会发出警告：
函数峰值（食物：字符串，能量：数字）：void {
console.log("我们的"+食物+"有"+能量+"卡路里。");
//参数与函数参数不匹配。
说话（“tripplecheesburger”，“atonof”）；
main.ts(5,30):errorTS2345:“字符串”类型的参数不能分配给“数字”类型的参数。
以下是一些最常用的数据类型：
您可以前往 TypeScript 官方文档查看所有变量类型的列表 – 单击此处 ()。
接口插孔
套接字通常根据对象是否符合某种结构来进行类型检查。 通过定义套接字，我们可以命名特殊的变量组合typescript 定义类，确保它们仍然可以一起运行。 当转换为 JavaScript 时，套接字消失了——它们的唯一目的是在开发阶段提供帮助。
在下面的示例中，我们定义一个简单的套接字来对函数参数进行类型检查：
//这里定义我们的Food接口、它的属性和它们的类型。
界面食物{
名称：字符串；
卡路里：数量；
//我们告诉我们的函数期望一个对象满足Food接口。
//这样我们就知道我们需要的属性将始终可用。
函数说话（食物：食物）：无效{
console.log("我们的"+food.name+"有"+food.calories+"卡路里。");
//我们定义一个对象，它具有 Food 接口期望的所有属性。
//注意类型将被自动推断。
varice_cream={
名称：“冰淇淋”，
卡路里：200
说话（冰淇淋）；
属性的顺序并不重要。 我们只需要存在必要的属性并且具有正确的类型。 如果有遗漏、类型错误或名称不同，编译器将发出警告消息。
界面食物{
名称：字符串；
卡路里：数量；
函数说话（食物：食物）：无效{
console.log("我们的"+food.name+"有"+food.calories+"克。");
//我们故意犯了错误，名字拼写错误为nmae。
varice_cream = {
nmae：“冰淇淋”，
卡路里：200
说话（冰淇淋）；
main.ts(16,7):errorTS2345:Argumentoftype'{nmae:字符串;卡路里:数字;}
无法分配给“食物”类型的参数。
属性'name'missingintype'{nmae:string;calories:number;}'。
这只是入门，因此我们不会详细介绍套接字。 不过，还有很多地方没有提到，我们建议查看 TypeScript 文档 - 点击这里。
种类
在构建小型应用程序时，尤其是使用 Java 或 C# 构建小型应用程序时，许多开发人员更喜欢面向对象编程。 TypeScript 提供了一个类系统，与 Java 和 C# 非常相似，包括继承、具体类、套接字实现、setter/getters 方法等。
值得一提的是，由于最新的 JavaScript 更新（ECMAScript2015），此类是 vanillaJS 原生的，但可以在没有 TypeScript 的情况下使用。 这两种实现非常相似，也有差异，TypeScript 更严格。
继续食物示例，这是一个简单的 TypeScript 类：
类菜单{
//我们的属性：
//默认情况下它们是公共的，但也可以是私有的或受保护的。
items:Array;//菜单中的项目，字符串数组。
pages:number;//菜单有多少页，一个数字。
//Astraightforward构造函数。
构造函数（item_list：数组，total_pages：数量）{
//this关键字是强制性的。
this.items=item_list;
this.pages=total_pages;
//方法
列表（）：无效{
console.log("我们今天的菜单：");
对于（变量=0；i
发表评论