TypeScript | 青训营笔记

35 阅读1分钟

这是我参与「第五届青训营 」伴学笔记创作活动的第 三 天

今日课程重点

1. TypeScript简介 2. TypeScript基础 3. TypeScript高级类型 4. TypeScript工程应用

TypeScript简介

TypeScript发展历史

image.png

TS/JS比较

动态类型:编译在执行时进行 变量使用前不需要类型声明,动态类型运行时才进行类型检查
静态类型:编译在执行前进行 编写程序时就要声明好变量的数据类型

弱类型语言特征:类型转换
eg:数字和字符串相加
强类型语言变量的使用要严格符合要求,必须先定义后使用,一旦完成定义就一直保持该数据类型除非强制进行类型转换

image.png

image.png

编译器:VS Code / TypeScript官网在线编译器

TypeScript基础

基础数据类型

image.png

对象类型

image.png

函数类型

image.png

函数重载

image.png

数组类型

image.png

补充类型

image.png

TypeScript泛型

image.png

image.png

类型别名&类型断言

image.png

字符串/数字 字面量

image.png

image.png

TypeScript高级类型

通过各种基础数据类型完成高级数据类型的定义

联合/交叉类型

image.png

image.png

类型保护&类型守卫

image.png

image.png

Merge 函数类型实现

image.png

image.png

image.png

函数返回值类型

image.png

image.png

TypeScript工程应用

image.png webpack loader:把不能识别的文件转为可识别的文件 www.npmjs.com/package/awe… www.npmjs.com/package/bab…

image.png