能用js重写的都会被typescript重写

导语： TypeScript从今天数以百万计的JavaScript开发者所熟悉的语法和语义开始。使用现有的JavaScript代码，包括流行的JavaScript库，并从JavaScript代码中调用TypeScript代码

能被js重写的中奖被typescript重写

没用过typescript可能会下面的两个疑问：

1. javascript越来越完善，还有没有必要学习typescript?

2. typescript学习的成本如何呢？

1. typescript的生态

针对这两个疑问我们来稍微地解答下：

typescript是javascript的超集，所有es2016, es2017, es2018等等，包括未来的标准就会被包含在typescript中：

尤其在多人合作的项目中，typescript能强制开发者的标准，对其他的开发者能天然的做到文档提示的功能，例如这段代码：

/**
 * 判断当前商品的状态
 * qcoin/object/redpack/flow类型的商品里，1表示待领取，2表示已领取；
 * code,url等类型的商品，会直接进行发送，1就表示已领取，没有状态2
 * 统一后：state: 0:未成功， 1:待领取， 2:已领取， 3:已过期， 4:已下架
 *
 * @param state 当前商品的状态
 * @param type qcoin(QB), object(实物), code(兑换码), url(纯链接), redpack(现金红包), flow(流量型)
 */
const getOrderState = (state: number, type: string): number => {
    if (state === 1 && (type === 'code' || type === 'url')) {
        return 2;
    }
    return state;
};

在调用 getOrderState 方法时，能直接提示该方法有几个参数，每个参数的类型是什么，返回的数据是什么类型的，如果错误地调用了该方法，则在编写阶段就会提示出来！

同时通过Google的搜索量上来看，大概有1850万的搜索结果，typescript的生态是越来越好。

而且，typescript对angular和react有着优良的支持，在使用react编写代码的过程中，同时尤雨溪也在用typescript对Vue3.0进行重写。之前尤雨溪也在知乎上说压flow压错了宝，typescript真香 https://www.zhihu.com/question/310485097/answer/591869966 。

2. typescript的学习成本

typescript的学习非常的低，针对一些平常的操作，随手就可以写上相应的类型。

function sum(a: number, b:number): number {
    return a + b;
}
sum(23, 56);

针对比较复杂的数据类型，可以通过 interface 来实现：

interface GoodsItem {
    cost: number; // 现价
    cover: string; // 图片
    customer_service: string; // 规则
    desc: string; // 描述
    discount_score: number; // 积分价格
    icon_url: string; // icon
    prize_enname: string;
    prize_zhname: string;
    rule: string[] | string; // 规则名
    score_cost: number; // 积分兑换的价格
    sending_count_today: number; // 今日发放的上限
    sending_count_total: number; // 总量
    short_name: string; // 短名称
    sort: number; // 权重
    state: number; // 状态
    type: string; // 类型
    validity: string; // 有效期
}

let goods: GoodsItem; // 使用GoodsItem来定义goods变量

当然，对一些更加复杂的，比如泛型等则需要特意地学习下。这里可以看下知乎上总结的 typescript骚操作 。

3. 总结

最开始写页面时，使用的是Vue，那时候就是纯按照教程上的方式来编写的，例如data, computed, watch等方法。在后来的项目中，使用 vue-property-decorator 来进行实现，虽然对于默认的对象书写方式有类型推导支持，但里面的实现绕了很多弯。问题的本质其实很简单：因为当初 API 的设计根本就没有考虑类型系统，Vue2.x对typescript支持的非常不好，我们也期待Vue3.0出现的变更。最近改用react写新的项目时，typescript发挥它很大的优势，类型提醒、数据提示(如dom对象下的方法)等，支持地都特别棒.

自从接触了typescript，总想着把之前所有用javascript实现的代码再用typescript重构一下。但是，历史代码能不动还是别动了，在以后新的项目中好好使用typescript即可！