这是我参与「第五届青训营 」笔记创作活动的第6天。活动详情：# 伴学笔记创作活动来袭 ｜ 第五届字节跳动青训营
在完成对 TypeScript 与 JavaScript 的分析后，本节课将带领大家认识 TypeScript 高级类型，提供常见的解决方案，帮助同学可以在日常的前端开发过程中，通过高级类型的方式，将普通类型的解决方案进行高级化。
- 联合交叉类型
/* 联合类型：A|B 表示一个值可以是几种类型之一
交叉类型：A&B 多种类型叠加到一起成为一种，包含了所需类型的所有特性。*/
type IBookList=Array<{
author:string;
}&({
type:'history';
range:string;
}|{
type:'history';
theme:string;
})>
- 类型保护与类型守卫
类型保护：访问联合类型时，出于程序安全考虑，仅能访问联合类型中交集部分
类型守卫：定义一个函数，其返回值为一个类型谓词，生效范围为子作用域。
function getIsIA(arg:IA|IB):arg is IA{
return !!(arg as IA).a;
}
联合类型+类型保护==>自动类型判断
- Merge 函数类型实现
/*
实现merge函数类型
要求sourceObj必须为targetObj的子集
*/
索引类型： 关键字keyof，其相当于取值对象中的所有key组成的字符串字面量
- 函数返回值类型
通过泛型进行表达。
/*extends 跟随泛型出现时表示类型推断，类三元表达式*/
/*infer出现在类型推荐中表示定义类型变量，可用于指代类型*/
type IReturnType<T extends (...args:any)=>any>=T extends(...args:any)=>infer R?R:any
- TypeScript 工程应用
浏览器Web webpack构建器
- 配置webapack loader相关配置
- 配置tsconfig.js文件
- 运行webpack启动/打包
- loader处理ts文件进行编译与检查
NodeJs 使用TSC进行编译
- 安装Node与npm
- 配置tsconfig.js文件
- 使用npm安装tsc
- 使用tsc运行编译得到js文件
