TypeScript知识点

TypeScript介绍

TypeScript为JavaScript的超集（ECMAScript6）， 这个语言添加了基于类的面向对象编程。TypeScript作为JavaScript很大的一个语法糖，本质上是类似于css的less、sass，都是为了易于维护、开发，最后还是编译成JavaScript。趁着周末的时间，浅尝了Typescript。

TypeScript 扩展了JavaScript语法，任何已经存在的JavaScript程序，可以不加任何改动，在TypeScript环境下运行。TypeScript只是向JavaScript添加了一些新的遵循ES6规范的语法，以及基于类的面向对象编程的这种特性。

其次，2016年9月底发布的Angular2框架，这个框架本身是由TypeScript编写的。Angular框架，大家都知道，它是由谷歌公司开发的，非常流行的框架。也就是说，现在TS这门语言是由微软和谷歌这两大公司在背后支持。因此我们有理由相信，在未来一段时间内，TS有可能成为前端开发语言中的主流。

• 微软开发的一门编程语言
• JavaScript的超集
• 遵循最新的ES6规范

TypeScrip优势

• 支持ES6规范：2015年发布的，它指出了未来一段时间内，客户端脚本语音的发展方向。
• 强大的IDE支持：体现在三个特性上，1.类型检查，在TS中允许你为变量指定类型。2.语法提示。3.重构。
• Angular2的开发语言

安装Typescript

npm install -g typescript

使用

新建Hello.ts文件

export class Hello {

}

运行 $ tsc Hello.ts 命令，可以看到生成了一个hello.js文件,即编译后最终在浏览器中执行的文件；

"use strict";
exports.__esModule = true;
var Hello = (function () {
    function Hello() {
    }
    return Hello;
}());
exports.Hello = Hello;

由于TS有强大的IDE支持，因此在IDE编译器下可以不用敲写命令，自动把ts文件编译成js文件；

Types

所有类型都是any类型的子类型，其他类型被分成元类型(primitive types)和对象类型(object types)。

1. 元类型包括 number, boolean, string, null, undefined
2. 对象类型为所有类、模块、接口和字面量类型；

//编译前
var b: any;             // 所有JavaScript值
var c;                  // Same as c: any
var a: number;               // 显式类型
var d: boolean;
var e: string;
var f: string[] = ["hello", "world"];    //数组类型
var g: [number, string] = [3, "three"];  //元组类型
var h: string | number; //联合类型，几个不同的类型之中的一个

function k() : void{  //void是any的子类型，是undefined的超类型，与其他类型无关
     alert('hi man');
}

//编译后
var b; // 所有JavaScript值
var c; // Same as c: any
var a; // 显式类型
var d;
var e;
var f = ["hello", "world"]; //数组类型
var g = [3, "three"]; //元组类型
var h; //联合类型，几个不同的类型之中的一个
function k() {
    alert('hi man');
}

总结：

　　Typescript的好处很明显，在编译时就能检查出很多语法问题而不是在运行时。不过由于是面向对象思路，如果是纯前端的人员（没有后端语言基础），那用起来应该是比较吃力的。有没有需求使用Typescript，我觉得写出代码是否易于维护、优雅，不在于用了什么框架、语言，在于开发者本身的架构思路。诚然好的框架和语言能间接帮助开发者写出规范的代码，但不代码就能写得好。所以如果Typescript能使团队易于协同开发，提高效率，那才考虑使用。如果都用得很痛苦，那还是简单的来。