什么是Typescript
JavaScript经过10年的打磨,现在的Typescript已经不是当年的Typescript,是行业的标准,以前的Coffee JS那些标准也逐渐退出市场,剩下的我目前觉得是ES标准和TS。
那么什么是TS呢?
TypeScript 是 JavaScript 的类型的超集,它可以编译成纯 JavaScript。编译出来的 JavaScript 可以运行在任何浏览器上。TypeScript 编译工具可以运行在任何服务器和任何系统上。TypeScript 是开源的。
为什么选择 TypeScript
我们为什么选择Typescript?主要是TypeScript 增加了代码的可读性和可维护性。
1.类型系统实际上是最好的文档,大部分的函数看看类型的定义就可以知道如何使用了
2.可以在编译阶段就发现大部分错误,这总比在运行时候出错好
3.增强了编辑器和 IDE 的功能,包括代码补全、接口提示、跳转到定义、重构等
4.TypeScript 拥抱了 ES6 规范,也支持部分 ESNext 草案的规范
TypeScript也是有缺点
1.有一定的学习成本,需要理解接口(Interfaces)、泛型(Generics)、类(Classes)、枚举类型(Enums)等前端工程师可能不是很熟悉的概念
2.短期可能会增加一些开发成本,毕竟要多写一些类型的定义,不过对于一个需要长期维护的项目,TypeScript 能够减少其维护成本
3.集成到构建流程需要一些工作量
4.可能和一些库结合的不是很完美
大家可以根据自己团队和项目的情况判断是否需要使用 TypeScript。
现在安装的TS变得如此简单,只需要在命令行输入
npm install -g typescript
以上命令会在全局环境下安装 tsc 命令,安装完成之后,我们就可以在任何地方执行 tsc 命令了。
编译一个 TypeScript 文件很简单:
tsc main.ts
我们约定使用 TypeScript 编写的文件以 .ts 为后缀,用 TypeScript 编写 React 时,以 .tsx 为后缀。
Hello TypeScript
我们从一个简单的例子开始。
function sayHello(person:string){
return 'Hello' + person;
}
let user = "Rain";
console.log(sayHello(user));
然后执行
tsc main.ts
这个时候生成了一个 main.js
function sayHello(person) {
return 'Hello' + person;
}
var user = "Rain";
console.log(sayHello(user));
TypeScript 中,使用 : 指定变量的类型,: 的前后有没有空格都可以。
上述例子中,我们用 : 指定 person 参数类型为 string。但是编译为 js 之后,并没有什么检查的代码被插入进来。
TypeScript 只会进行静态检查,如果发现有错误,编译的时候就会报错。
下面尝试把这段代码编译一下:
function sayHello(person: string) {
return 'Hello, ' + person;
}
let user = [0, 1, 2];
console.log(sayHello(user));
报错提示
index.ts(6,22): error TS2345: Argument of type 'number[]' is not assignable to parameter of type 'string'.
TypeScript 编译的时候即使报错了,还是会生成编译结果,我们仍然可以使用这个编译之后的文件。
如果要在报错的时候终止 js 文件的生成,可以在 tsconfig.json 中配置 noEmitOnError 即可。关于 tsconfig.json,请参阅官方手册(中文版)。