TypeScript 入门省流版
TypeScript 是什么
JavaScript 的超集,主要提供了类型检测和对 ES6 的支持
简单来说,就是 TypeScript = ES6 +类型。因为写类型,能在写代码时检测出错误,以至于减少bug。现在前端项目越来越大、各种前端工程化、全栈化、各种前端框架等等, TypeScript 随之流行也很正常
为什么学 Typescipt
它提供静态类型系统,增加代码的可读性以及可维护性,已经成为大型项目的标配
用了之后就不想用 Javascript 了,有代码提示,不用担心会写错误代码了
typescript
const button = document.getElementById('XXX')
button?.addEventListener('click', function() {
// 自动加 ? 等于 if (button) {}
this.style.border = '1px solid red' // ok
this.addClass() // 报错提示
})
起手式
安装 typescript
bash
npm i typescript -g
编写 ts 文件
tsx
const hello: string = 'hello';
编译 ts 文件
tsc hello.ts
编译之后就生成了 hello.js
javascript
var hello = "hello";
如此,你的第一个 ts 文件就写好了
这里我们用 typescript 来实现类型擦除,还可以用esbuild、swc 来实现,性能比 typescript 快很多,但是后两者不检查语法,所以快
数据类型
TS 的数据
类型断言 as
typescript
let result: unknown = 10;
let data: number = result; // 报错,不能将类型“unknown”分配给类型“number”。
let data1: number = result as number; // 使用 类型断言as 将 unknown 类型转换为 number 类型