特性
JavaScript
与 TypeScript
的区别:
TypeScript
是 JavaScript
的超集,扩展了 JavaScript
的语法。
因此,现有的 JavaScript
代码可与 TypeScript
一起工作无需任何修改,TypeScript
通过类型注解提供编译时的静态类型检查。
TypeScript
可处理已有的 JavaScript 代码,并只对其中的 TypeScript
代码进行编译。
TypeScript 安装
可以通过以下两种方式来安装 TypeScript
:
- 通过
Node.js
包管理器 (npm) - 安装
Visual Studio
的TypeScript
插件
通过npm 安装
首先,创建一个工程文件夹:
mkdir typescript-demo
新建src目录:
mkdir src
进入工程文件夹,安装 TypeScript npm
包:
npm install -g typescript
安装完成:
安装完成后就可以使用 TypeScript 编译器,名称叫 tsc,可将编译结果生成 js 文件。
编译命令
编译 TypeScript 文件命令:
tsc filename.ts
一旦编译成功,就会在相同目录下生成一个同名 js 文件,当然,也可以通过命令参数来修改默认的输出名称。
同时编译多个 ts 文件:
tsc file1.ts file2.ts file3.ts
一旦编译成功,就会在相同目录下生成多个同名 js 文件,当然,也可以通过命令参数来修改默认的输出名称。
默认情况下编译器以ECMAScript 3(ES3)为目标,但ES5也是受支持的一个选项。TypeScript增加了为 ECMAScript 6
标准所建议的特性的支持。
构建一个 TypeScript
Web 应用
首先,创建一个 index.html 文件:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>typescript demo</title>
</head>
<body>
<script src="hello.js"></script>
</body>
</html>
创建一个 hello.ts
文件(.ts 是 TypeScript 文件的后缀):
alert('This is a TypeScript demo!')
接下来,打开命令行,使用 tsc 命令编译 hello.ts 文件:
$ tsc hello.ts
在相同目录下就会生成一个 hello.js 文件,此时项目结构:
typescript-demo
|- /src
|- hello.js
|- hello.ts
然后,打开 index.html:
语法特性
-
类 Classes
-
接口 Interfaces
-
模块 Modules
-
类型注解 Type annotations
-
编译时类型检查 Compile time type checking
-
Arrow 函数 (类似 C# 的 Lambda 表达式)
相关书籍
http://ts.xcatliu.com/