为什么学习TypeScript
TypeScript VS javascirpt
| TypeScript | JavaScript |
|---|---|
| JavaScript的超集，用于解决大型项目的代码复杂性 | 一种脚本语言， 用于创建动态网页 |
| 强类型，支持静态和动态类型 | 动态弱类型语言 |
| 可以在编译期间发现并纠正错误 | 只能在运行时发现错误 |
| 不允许改变变量的数据类型 | 变量可以被赋值成不同类型 |
TypeScript带来了什么？
- 类型安全
- 下一代js特性
- 完善的工具链
TypeScript推荐
Awesome Typescript ： TS 开源教程及应用
Typescript Playground ： TS 到 JS 在线编译
TypeScript基础
基础类型
- boolean 、 number 、 string
- undefined 、 null
- any 、 unknown 、 void
- never
- 数组类型
- 元组类型 tuple
函数类型
定义： TS 定义函数类型时要定义输入参数类型和输出类型
输入参数：参数支持可选参数和默认参数
输出参数：输出可以自动推断，没有返回值时，默认为 void 类型
函数重载：名称相同但参数不同，可以通过重载支持多种类型
Ts-interface
定义：接口是为了定义对象类型
特点：
-
可选属性： ？
-
只读属性： readonly
-
可以描述函数类型
-
可以描述自定义属性
-
总结：接口非常灵活 duck typing
TS-类
写法和 JS 差不多，增加了一些定义
特点：增加了 public 、 private 、 protected 修饰符
抽象类：
- 只能被继承，不能被实例化
- 作为基类，抽象方法必须被子类实现
- interface 约束类，使用 implements 关键字
TypeScrip进阶
高级类型
-
联合类型 |
-
交叉类型 &
-
类型断言
-
类型别名（ type VS interface ）
-
定义：给类型起个别名
-
相同点：
- 都可以定义对象或函数
- 都允许继承
- 差异点：
- interface 是 TS 用来定义对象， type 是用来定义别名方便使用；
- type 可以定义基本类型， interface 不行；
- interface 可以合并重复声明， type 不行；
应用泛型
软件工程中，我们不仅要创建一致的定义良好的 API ，同时也要考虑可重用性。 组件不仅能够支持当前的数据类型，同时也能支持未来的数据类型， 这在创建大型系统时为你提供了十分灵活的功能
泛型基本使用
基本定义：
-
泛型的语法是 <> 里面写类型参数，一般用 T 表示；
-
使用时有两种方法指定类型：
-
- 定义要使用的类型
-
- 通过 TS 类型推断，自动推导类型
-
- 泛型的作用是临时占位，之后通过传来的类型进行推导；
泛型工具类型-基本操作符
-
typeof: 获取类型
-
keyof: 获取所有键
-
in: 遍历枚举类型
-
T[K]: 索引访问
-
extends: 泛型约束
泛型工具类型-常用工具类型
- Partial: 将类型属性变为可选
- Required: 将类型属性变为必选
- Readonly: 将类型属性变为只读
- Pick 、 Record…
