深入浅出TypeScript | 青训营笔记

82 阅读2分钟

1 TS与JS

image.png

ts是js的扩展与超级

ts类型安全;ts包含一些编译器会支持js中新版ES才会支持的特性;ts有完善的工具链

总结:ts不仅仅是一门语言,提高工作效率的生产力工具

2 TS基础 1.boolean,number(整数,浮点数,负数,有一定灵活性,在js上作了扩展),string

2.枚举enum(ts特有,对枚举值作类型定义)

3.any,unknow,void

4.never(永远不存在值的类型)

5.数组类型

6.元组类型tuple(标数组中每一个元素)

函数类型:

image.png

函数重载:名称相同但参数不同,可以通过重载支持多种类型(使用宽泛)

interface(接口):

image.png

对象类型:具体描述一个js对象,是对所有键值对的描述

TS中类描述了所创建的对象共同的属性和方法。

3 高阶类型 联合类型 |,交叉类型 &,例子如下图所示:

image.png

注意:同名类型取交集,同名非基础类型合并进行相关元素操作

类型断言: 把两种能有重叠关系的数据类型进行相互转换的一种 TS 语法,把其中的一种数据类型转换成另外一种数据类型。类型断言和类型转换产生的效果一样,但语法格式不同。

类型别名:

image.png

3.1 泛型

image.png

image.png

泛型基本定义:

image.png

泛型基础操作符: 两种基础操作符:typeof:获取类型;keyof:获取所有键 还有:in(遍历枚举类型),T[K]:索引访问,extends:泛型约束

image.png

4 TS实战

类型声明:就是给变量设置了类型,使得变量只能存储某种类型的值

类型声明的作用:

1.通过类型声明可以指定 TS 中的变量(参数,形参)的类型

2.指定类型之后,再给变量赋值,会自动进行检测,如果符合则赋值,不符合则会抛出错误

image.png

相关案例:

image.png