这是我参与[第五届青训营]笔记创作活动的第四天
本课堂重点内容：
- TypeScript 历史及定义解析
- TypeScript 优势解读
- TypeScript 练习工具
- 联合交叉类型
- 类型保护与类型守卫
- Merge 函数类型实现
- 函数返回值类型
- TypeScript
详细知识点介绍：
TypeScript 发展历史
- 2012-10 微软发布 TypeScript 第一个版本
- 2014-10 Angular 发布基于 TypeScript 的2.0版本
- 2015-04 微软发布 VS Code
- @types/react 发布， TypeScript 可开发 React
- 2020-09 Vue 发布 3.0 版本，官方支持 TypeScript
- 2021-11 v4.5版本发布
TypeScript 优势
1. 静态类型：
- 可读性增强：基于语法解析TSDoc，ide增强
- 可维护性增强：在编译阶段暴露大部分错误，在多人合作的大型项目中，有更好的稳定性和开发效率
2. JS 的超集：
- 包含兼容所有 js 特性，支持共存
- 支持渐进式引入与升级
基础数据类型与高级类型
- 基础数据类型：字符串、数字、布尔值、null、undefined
- 对象类型：只读属性（约束属性不可在对象初始化外赋值）、可选属性（定义该属性可以不存在）、任意属性（约束所有对象属性都必须是该属性的子类型）
- 数组类型：[类型 + 方括号]、泛型（泛型接口，多泛型，泛型类，泛型别名，泛型约束）、元组、接口
- 补充类型：空类型，表示无赋值、任意类型，是所有类型的子类型、枚举类型，支持枚举值到枚举名的正、反向映射
- 类型别名、类型断言
- 字符串/数字 字面量
- 联合类型：IA | IB；联合类型表示一个值可以是几种类型之一，交叉类型：IA & IB；多种类型叠加到一起成为一种类型，它包含了所需的所有类型的特性
实践练习例子：
联合交叉类型：
type IBookList = Array<{
author: string;
} & ({
type: 'history';
range: string;
} | {
type: 'story';
theme: string;
})>
实现函数logBook类型
function logBook(book: IBookItem) {
// 联合类型 + 类型保护 = 自动类型推断
if (book.type === 'history') {
console.log(book.range)
} else {
console.log(book.theme)
}
}
个人课后总结：
TypeSCript 的高级类型使用较为复杂，需配合文档进行深入了解
