TypeScript——初步认识

JavaScript的痛点

众所周知,前端开发“三剑客”分别是HTML、CSS以及JS,其中JS由于其灵活简单等特点获得了大家的青睐,但是成也萧何败萧何,由于JS设计初衷是浏览器的嵌入式脚本语言,作为脚本语言本身就不像Java等工程语言一样适合大项目开发。之前用JS写过前端程序,由于JS没有命名空间且变量类型为弱类型,当代码写到几千行以上时随着JS文件及变量的增多,程序运行逻辑将会乱成一团,后续开发及维护举步维艰。这些问题是JS本身特点带来的,因为JS在设计初始并没有想到后面的前端开发逻辑会这么复杂,虽然JS号称基于对象的语言,但是却很难模块化。为解决该问题,一些JS模块化框架应运而生,例如Require.js、sea.js等,但这只是权宜之计,并没从根本上解决JS本身语言特性。

解决JS语言本身的问题,看起来只有两种方法,要么JS实现一次重大升级,要么重新设计一种语言来代替JS。但是听起来很美好,实际却不可行。首先JS发展至今,语言本身相对成熟,最多会小修小补,颠覆性的升级不大可能。其次,JS已经拥有了大批的用户及得到了各大浏览器的全面支持,可以看成网页的一种规范标准了,设计一种全新的语言取代JS基本无望。于是,微软采用曲线救国,设计了一种TypeScript,定义为JavaScript的超集。意思就是JavaScript可以做的,我可以做,JavaScript不能做的,我还可以做。同时熟悉JS的迁移到TypeScript上面基本无成本,因为TypeScript全面兼容JavaScript,语法定义等基本类似。

TypeScript方案

TypeScript针对JavaScript弱类型、没有命名空间、难以模块化等缺点对症下药,规定了变量必须是强类型,同时添加any类型兼容JS的弱类型。同时带来了严格的面向对象定义,每一个ts文件需要定义成一个或多个类,同时向外面暴露接口。我把TypeScript比作Java版的JavaScript,很多对象的定义及使用跟Java像极了。这样从语言上解决了JS的问题,编程过程中我只需考虑对象之间的关系而不是JS文件、变量之间的关系,大大提高了前端生产力且提高了程序健壮性及可维护性。

目前三大主流前端框架(谷歌的Angular、Facebook的React.js以及Vue.js)都已经支持TypeScript语言,其中Angular更是如此。它本身就是用TypeScript写出且规定TypeScript为默认编程语言。Angular提供了很多功能强大的库函数,通过引入模版即可快速使用。

TypeScript为什么全面兼容JavaScript及所有浏览器呢?因为它是“始于JavaScript,归于JavaScript”。TypeScript有一个编译器,所有TypeScript程序都可以编译成不同规范标准的JavaScript程序,因此并不改变目前的JS生态。下面是一个用TS写的一个类及编译成JS的例子:

TS定义一个对象:

class BankAccount {
balance = 0;
deposit(credit: number) {
this.balance += credit;
return this.balance;
}
}

经过编译器转换成的JS代码:

var BankAccount = (function () {
function BankAccount() {
this.balance = 0;
}
BankAccount.prototype.deposit = function(credit) {
this.balance += credit;
return this.balance;
};
return BankAccount;
})();
上一篇:01-Vue.js入门系列


下一篇:mahout分类