TypeScript 入门教程

前言:站长感悟

系统化地做完这个《TypeScript入门教程》,我对TypeScript有点失望。我的感觉就“乱”,乱七八糟的设计理念,以“type”为例,既然想设计出一个别名的功能,那简单明了、功能单一这样就行了,非得跟“interface”牵扯不清,搞的我云里雾里的,而且我看网上其他人的介绍,也是众说纷纭。大家都在讨论这个问题,都没有讨论清楚,谁也说服不了谁,这说明这个问题自身就有问题了。汗!

TypeScript的设计者是安德斯·海尔斯伯格(Anders Hejlsberg),是我之前的崇拜的对象,因为我在毕设中用过Delphi。但是说实话,我感觉TypeScript的设计明显不如Java,正如开头所说,它违背了“职责单一”的原则,令人费解难懂,抓狂不已。

虽然手心中冒出一万个流星锤,恨不得把TypeScript锤死,但是转眼一想,也许海尔斯伯格也很无奈,因为JavaScript的本身就很凌乱。既来之则安之,那就先学习吧,看着不爽之处则取其精华去其糟粕罢了。

1、TypeScript产生背景

TypeScript是微软开发的一种开源的编程语言,其通过在JavaScript的基础上添加静态类型构建而成。TypeScript是JavaScript的一个超集,通过TypeScript编译器或Babel可转译为JavaScript代码,亦可运行在任何浏览器之中。

由于JavaScript语言本身的局限性,难以胜任大型项目开发,因此微软开发了TypeScript,使得其能够肩负起开发大型项目的重任。正如微软所预想的一样,如今TypeScript在开发界获得了广泛的关注。

TypeScript当前稳定版本是 4.0。

2、TypeScript作者介绍

TypeScript的作者是安德斯·海尔斯伯格(Anders Hejlsberg),一个丹麦天才,他对语言和汇编的理解全世界没几个人能超越,曾主导过划时代的产品,被称为Delphi之父、C#之父、TypeScript之父。海尔斯伯格是无数程序员崇拜的对象,当然也包括笔者在内。现在是个极好的学习机会,让我们一块儿领略如此伟大的程序员之杰作吧。

3、TypeScript和JavaScript区别

TypeScript是JavaScript的类型化超集,可以编译成普通的JavaScript。TypeScript给JavaScript添加新的特性,例如:类、接口、模块、装饰器等。TypeScript和JavaScript区别如下表所示:

TypeScript JavaScript
面向对象的语言 脚本语言
静态类型 没有静态类型
支持模块 不支持模块
支持可选参数 不支持可选参数

4、TypeScript的安装

通过npm安装TypeScript

npm install -g typescript

或者

npm tsc

5、编译TypeScript文件

任何TypeScript文件的扩展名都是.ts。因为任何JavaScript文件都是TypeScript文件,因此,将.js的扩展名更改为 .ts后,您的第一个TypeScript文件就准备好了。要将任何.ts文件编译为.js文件,请使用以下命令:

tsc <TypeScript File Name>

例如:编译hello.ts文件

tsc hello.ts

编译结果为:hello.js

另外,还可以把多个ts文件编译成一个js文件。编译时,我们需要添加–outFILE [OutputJSFileName]选项,如下所示:

tsc --outFile all.js file1.ts file2.ts file3.ts

这将编译所有3个.ts文件,并输出到单个all.js文件中。

tsc --outFile file1.ts file2.ts file3.ts

如果您不提供输出文件名,则将编译 file2.ts 和 file3.ts 并将输出放置在 file1.ts 中。

6、教程说明

本教程的目的是为了帮助大家学习并掌握typescript这门开发语言。各位读者在学完之后,想动手练习或者想挣点外快,欢迎加入我们网站的社群,这里会有很多实战项目等着你去实战。