|
还不知道typescript是啥的前端童鞋需要做下功课了。
接触typescript挺早的。13年底的时候，公司的牛人在团队内推广typescript，没多久我们就把typescript做的项目搞上了生产环境。玩新东西的初期都是很爽的，但没多久就变成了灾难。团队人员更替，培训/学习成本增加；开发工具不统一，效率极其低下；ts带来的利好被消耗的一干二净，只有无尽的坑。种种不顺，最后不得不把所有ts文件删除。
这是一次不好的经历，后面我很长一段时间都没再写过typescript了。但是，15年发生了两件事，让typescript再次回到我的视线。
一是es6规范的落地，二是visual studio code的发布。这两条正好解决了上面提到的两个主要痛点：语言和工具。
随着es6的普及，应该没几个前端童鞋会说自己不会点es6了吧。typescript最初就是基于es6的，箭头函数、模块、类等等，只不过是在es6的基础上加了个强类型（要是会as就更简单了）。放到现在的前端环境，typescript的学习成本已经很低了，比各种前端框架的学习成本都低，可以放心在团队内推广。
再说开发工具。typescript刚出的时候只有vs、vim、webstorm支持，除了微软自家vs系列，其他编辑器对ts的支持仅仅只有语法检测，智能提示、重命名什么的那是妄想。
而visual studio体积太大，轻量级的express也接近1G了，光这一点就能吓跑一拨童鞋了。然而，去年4月底，visual studio code横空出世，没有vs家族的庞大体积，性能又甩出同源的atom几条街，对typescript和javascript的支持相当给力，简直就是为前端童鞋而生的。今年4月中旬，vs code就会发布1.0版本，也就下周的事了。要不为什么说ms大法好？
除了语言和工具，typescript的生态也在不断完善，DefinitelyTyped上有各种主流框架/类库的头文件，满足各种各样的需求；头文件管理工具tsd(已经废弃，新的工具叫typings)也做的越来越好，ts项目管理一个json文件就搞定。
一门语言，有了良好的生态，要火起来那是迟早的事。
好了，说回正题。
react
第一次看到React.propTypes的时候，心想这不就是interface么，typescript+react指日可待啊。果然，typescript从 v1.6开始支持jsx语法。组件的props和state都可以定义interface，类型检测有了，propTypes拜拜。
直接贴代码：
interface Props {
from: string;
message: string;
}
class Greeting extends React.Component<Props,any> {
render () {
const {from,message} = this.props;
return (
<div>
<p>来自{from}的消息</p>
<p>{message}</p>
</div>
)
}
}
配上vs code,到哪都有的智能提示简直不能再爽，贴张gif感受下。
Greeting这个组件有两个prop，from和message，不传这两个prop或者类型搞错，编辑器都会有提示，state也是一样的道理。这tm就是生产力啊！！！
最终编译出来的文件长这个样子,再搭配webpack简直完美。
前一阵子写的web版cnode就是用typescript+react写的。
node
js不是java之类的静态语言，很多错误都只能在运行的时候才发现，而typescript正好弥补了这一点，强类型让很多错误在开发的时候就能被发现。再有人吐槽node不能搞大型应用，typescript+node分分钟打脸。
除了强类型外，用typescript还可以体验node暂时不支持的es6特性，现在有很多童鞋都是直接写再用babel编译，而typescript生来就具备这一能力，在一定程度上取代了babel的作用。
v1.7的typescript已经支持async/await，异步流程控制不再是问题。koa2发布了，对应的koa.d.ts也有人写好了（感谢DavidCai1993童鞋），现在就是typescript+node的最好时机。
直接看图：
代码和用js写没什么两样，通过头文件，可以很清楚地知道变量类型、函数返回值等信息，不用查api，不怕会写错。
那只剩调试的问题了，typescript和babel一样，都可以通过sourcemap来调试，做好配置，和调试js一毛一样。
以koa2为例：
结语
typescript是好东西，大家快搞起！
typescript是好东西，大家快搞起！
typescript是好东西，大家快搞起！
最后，贴一下typescript的roadmap，中文版的在这里。 （编辑：李大同）
【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!
|
