没用过typescript可能会下面的两个疑问: 针对这两个疑问我们来稍微地解答下: typescript是javascript的超集,所有es2016, es2017, es2018等等,包括未来的标准就会被包含在typescript中: 尤其在多人合作的项目中,typescript能强制开发者的标准,对其他的开发者能天然的做到文档提示的功能,例如这段代码: 在调用 同时通过Google的搜索量上来看,大概有1850万的搜索结果,typescript的生态是越来越好。 而且,typescript对angular和react有着优良的支持,在使用react编写代码的过程中,同时尤雨溪也在用typescript对Vue3.0进行重写。之前尤雨溪也在知乎上说压flow压错了宝,typescript真香https://www.zhihu.com/question/310485097/answer/591869966。 typescript的学习非常的低,针对一些平常的操作,随手就可以写上相应的类型。 针对比较复杂的数据类型,可以通过 当然,对一些更加复杂的,比如泛型等则需要特意地学习下。这里可以看下知乎上总结的typescript骚操作。 最开始写页面时,使用的是Vue,那时候就是纯按照教程上的方式来编写的,例如data, computed, watch等方法。在后来的项目中,使用 自从接触了typescript,总想着把之前所有用javascript实现的代码再用typescript重构一下。但是,历史代码能不动还是别动了,在以后新的项目中好好使用typescript即可!
1. 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
方法时,能直接提示该方法有几个参数,每个参数的类型是什么,返回的数据是什么类型的,如果错误地调用了该方法,则在编写阶段就会提示出来!2. 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变量
3. 总结 #
vue-property-decorator
来进行实现,虽然对于默认的对象书写方式有类型推导支持,但里面的实现绕了很多弯。问题的本质其实很简单:因为当初 API 的设计根本就没有考虑类型系统,Vue2.x对typescript支持的非常不好,我们也期待Vue3.0出现的变更。最近改用react写新的项目时,typescript发挥它很大的优势,类型提醒、数据提示(如dom对象下的方法)等,支持地都特别棒.
版权属于:
加速器之家
作品采用:
《
署名-非商业性使用-相同方式共享 4.0 国际 (CC BY-NC-SA 4.0)
》许可协议授权
评论