一、typescript介绍和安装

270 阅读2分钟

TypeScript是一种由微软开发的自由和开源的编程语言,它是JavaScript的一个超集,他本质还是要转化为javascript,现在大部分的浏览器还只兼容到es5,所有就得把Typescript代码转化为javascript代码;
es6是约定,所有浏览器都可以实现,但是不是所有浏览器都支持,在这个上chrome支持的最好,有时,当我们处于“use strict”模式时,ES6的特性才会被打开,因此为了测试我们的ES6代码,我的建议是总是在文件的顶部添加“use strict”。
在这里要特别提醒,要支持es6,node的版本最少要6以上,这边用的是8.11.1的版本

typescript转化为javascipr的过程,成为编译,一般都用tsc在命令行上编译 当然在angular项目中,没有必要使用tsc去编译,因为webpack会完成这项工作;
接下来开始去了解typescript

首先安装typescript,在命令行中敲上

npm install -g typescript

上面这个命令执行完后,你电脑就安装了typescipt的编译器,并且自动的把tsc给你加到环境变量,显示版本号

tsc -v
Version 2.9.1

在你喜欢的地方,新建一个文件夹,然后新建一个文件,然后在里面创建一个hello.ts的文件,在里面输入

console.log('hello world')

然后在这个文件目录下,打开命令行输入

tsc hello.ts

执行完毕以后,你会发现,在你的文件夹下多了一个hello.js的文件,运行这个文件

使用node hello.js

而这样每写一次文件就要编译一次,是不是觉得很麻烦,tsc给我们很好用的参数

tsc -w hello.ts

上面这样就可以自动监听hello.ts文件的变化了

除了以上的参数以外,还可以这样写

tsc -t ES6 -w hello.ts

这样就会编译未es6的代码,同样的写法参数不同可以转化为ES5的,当然默认不带==-t==是转化为ES5的

这样每次输入命令都得自己手动输入参数,是不是觉得很麻烦,其实还有更简单的办法,tsc可以根据配置文件进行读取,然后操作,在命令行中输入

tsc --init

以上执行完后,你就会发现,在文件夹目录下,多了一个tsconfig.json的文件;

现在如果你想监听文件夹下的所有文件,只要在命令行中输入

tsc -w

它会根据tsconfig.json配置去监听这个目录下的所有文件

tsc -w

其实如果在编译的过程中报错了,一般的,tsc还是会输出文件,如果不想它输出,可以去配置tsconfig.json

es6和typescript参考链接:https://codecraft.tv/courses/angular/es6-typescript/1/