安装后就可以使用命令来编译用TypeScript编写的.ts文件成为.js文件，这样让编写的文件在浏览器上运行。编译的过程可以通过配置来选择使用ES5或者ES6的语法来编译，这点还是很方便强大的。

支持 TypeScript 的文本编辑器

此外随着TypeScript的日益流行，现在也出现了更多本身支持或者通过插件支持 TypeScript 语法、智能提示、纠错、甚至是内置编译器的文本编辑器和IDE。

• Visual Studio Code– 微软另外一个轻量级的开源代码编辑器。内置支持TypeScript。

• Sublime Text的官方免费插件。

• WebStorm的最新版本带有内置支持。

• 其他包括Vim，Atom，Emacs等。

静态类型

TypeScript 一个很独特的特征是支持静态类型。意思就是可以声明变量的类型，（因此）编译器就可以确保赋值时不会产生类型错误。如果省略了类型声明，TypeScript 将会从代码中自动推测出正确的类型。

这有个例子。任意变量，函数自变量或者返回值在初始化时都可以定义自己的类型

因为 JavaScript 是弱类型语言（即不声明变量类型），因此 TypeScript 编译为 JavaScript 时，（变量类型的声明）全部被移除：

然而，如果我们试着输入非法的语句，tsc 会警告代码里有错误。例如：

以下是一些最常用的数据类型：

• Number (数值类型) – 所有数字都是数值类型的，无论是整数、浮点型或者其他数值类型都相同。

• String（字符串类型） – 文本类型，就如 vanilla JS 字符串一样可以使用单引号或者双引号。

• Boolean（布尔类型） – true 或者 false，用 0 和 1 会造成编译错误。

• Any（任意类型） – 该类型的变量可以设定为字符串类型，数值类型或者任何其他类型。

• Arrays（数组类型） – 有两种语法：my_arr: number[];或者my_arr: Array

• Void （空类型）- 用在不返回任何值的函数中。

Interfaces 接口

接口通常会根据一个对象是否符合某种特定结构来进行类型检查。通过定义一个接口我们可以命名一个特殊的组合变量，确保它们会一直一起运行。当转译成 JavaScript 时，接口会消失 – 它们唯一的目的是在开发阶段里起到辅助的作用。在下面的例子中我们定义了一个简单的接口来对一个函数自变量进行类型检查：

属性的顺序并不重要。我们只需必要的属性存在并且是正确的类型。如果哪里有遗漏，类型错误，或者命名不同的话，编译器都会报警告信息。

类

在搭建大型规模的应用程序时，尤其是在 Java 或 C# 当中，许多开发者会优先选择面向对象编程。TypeScript 提供一个类系统，和 Java、C# 中的非常相似，包括了继承，抽象类，接口实现，setters/getters 方法等。

值得一提的是由于最新的 JavaScript 更新（ECMAScript 2015），这些类对于 vanilla JS 来说是原生的，并且在没有 TypeScript 的情况下也可以使用。这两种实现方式非常相似但是也有不同的地方，TypeScript 更加严格一些。

继续上面的 food的 例子，这里有一个简单的TypeScript类：

只要写过一点 Java 或者 C# ，就会发现TypeScript和它们在语法上非常相似。继承也是一样：

泛型

泛型（Generics）是允许同一个函数接受不同类型参数的一种模板。相比于使用 any 类型，使用泛型来创建可复用的组件要更好，因为泛型会保留参数类型。

一段简单的脚本例子，传入一个参数，返回一个包含了同样参数的数组。

第一次调用函数的时候，我们将类型手动设置成字符串。第二次及以后再次调用的时候就不必这样做了，因为编译器会判断传递过什么参数并且自动决定哪种类型最适合。虽然不是强制性的，但是由于编译器在众多复杂环境中确定正确类型的时候可能会失败，所以每次都传入类型是好的做法。

TypeScript 本身是开源的，同时其架构设计的也很优秀，提供了大量的API来供开发人员来扩展其功能，目前仍在积极开发和持续演变中。

随着各大厂商对ES6标准的不断支持，TypeScript 和 JavaScript 都会有属于他们自己的舞台，让前端技术能够适应越来越复杂的应用成为可能。

如果你有什么疑问或者问题，请关注我并给我私信，我将在第一时间给予回复！

閱讀更多 軟件先生 的文章

關鍵字: 标准 ECMAScript 三分钟