TypeScript优势

原作者: [db:作者] 来自: [db:来源] 收藏邀请

demo.js

function demo(data) {
　　return Math.sqrt(data.x ** 2 + data.y ** 2);
}
demo();

demo.ts

function tsDemo(data:{x: number, y: number}) {
　　return Math.sqrt(data.x ** 2 + data.y ** 2);
}
tsDemo();

通用的一段代码，在 js 里面在需要传递参数的地方没传递参数，编辑器不会报错，在 ts 里面会报错 Expected 1 arguments, but got 0。改成 tsDemo({x: 1, y: 123}); 就不会了

这是 ts 的第一个优势，在编写代码的时候，就能快速定位一些潜在的问题。

ts 的第二个优势是更友好的编辑器自动提示，在 js 里面，data. 后面不会提示 x，在 ts 里面，data. 的时候会提示x,y

ts 的第三个优势是代码语义更清晰易懂，在编写代码，可以明确知道，data 里面应该包含 x 和 y 这两个属性，在阅读代码的时候可以读出一些潜在逻辑，这个函数里面要用到 x,y。js 里面完全不知道这里面要用什么参数，要深层次的阅读代码才知道

还有更容易理解的方式

interface Point {x: number, y: number}

function tsDemo(data: Point) {
　　return Math.sqrt(data.x ** 2 + data.y ** 2);
}

tsDemo({x: 1, y: 123});

看出这个函数必须接受这样的一个点

该文章已有0人参与评论

专题导读

TypeScript中是使用强类型函数作为参数发布时间：2022-07-18

TypeScript-字面量类型发布时间：2022-07-18

在线客服（服务时间 9:00～18:00）

在线QQ客服

地址：深圳市南山区西丽大学城创智工业园

电邮：jeky_zhao#qq.com

移动电话：139-2527-9053