一句话介绍TypeScript:
TypeScript是JavsScript的超集,包含JavaScript的一切
为什么使用TypeScript:
TypeScript 是在编译后去执行代码,在编译的过程中规避掉JavaScript运行时产生的错误。
- JS 是动态类型的编程语言,动态类型最大的特点就是它只能在
代码执行期间做类型的相关检查 - TS 是静态类型的编程语言,代码会先进行编译然后去执行,在
代码编译期间做类型的相关检查,如果有问题编译是不通过的,也就暴露出了问题。
TypeScript 基本数据类型:
- 基础类型(JS&TS):
numberstringbooleannullundefined - 复杂类型:
数组对象函数
基础类型定义:
数组类型定义
联合类型
类型与类型之间使用 | 连接,代表类型可以是它们当中的其中一种,这种类型叫:联合类型
类型别名
函数类型
对象类型
接口类型 interface
接口继承interface 接口A extends 接口B {}
类型推断
字面量类型
断言类型
const aLink = document.getElementById('link') as HTMLAnchorElement
通过类型断言,aLink 的类型变得更加具体,这样就可以访问 a 标签特有的属性或方法了 明确类型
泛型
泛型是一种创建可复用代码组件的工具。这种组件不只能被一种类型使用,而是能被多种类型复用。
any 类型
任意类型 => 不推荐使用
TS踩坑: 在日常项目中,我使用Prettier 插件:
在 TypeScript 中使用泛型时,确实可能会遇到语法与 JSX 语法冲突的问题,特别是在使用尖括号 (<>) 时。为了避免 TypeScript 将泛型解析为 JSX
可以将.ts文件 在vscode 中配置语言模式为 ts 而不是tsx