一、TS运行环境搭建
1、安装
安装命令
npm i -g typescript
第一步:新建index.html和demo.ts
第二步:在index.html引入demo.ts文件
第三步:运行TS的命令
tsc demo.ts
注意:运行命令后,会将ts文件转换成js文件
如果想要实时转换运行命令
tsc demo.ts -w
2、配置文件
第一步:安装命令
tsc --init
注意:运行命令后,将生成tsconfig.json文件
二、类型声明空间与变量声明空间
1、类型声明空间
2、变量声明空间
注意: 类型声明空间与变量声明空间不可以互相赋值,下面例子是错误的。
注意:class类,它即是类型声明空间也是变量声明空间,所以它可以赋值给他们;
三、类型注解与类型推断
那么TS是如何把两个空间联系到一起的呢?
注意:类型推断就是,TS自动推断类型的过程。TS就算没有指定类型也不可以不同类型的变量之间进行赋值。
四、类型分类与联合类型与交叉类型
1、联合类型
注意:类型之间进行或的操作
2、 交叉类型
注意:类型之间进行与的操作
五、类型断言与非空断言
1、类型断言:as
注意:类型断言主要用于TS推断出来的类型并不满足你的需求,你需要手动指定一个类型。
2、非空断言:!
六、数组类型与元祖类型
1、数组类型
2、元祖类型
注意:元祖类型允许一个已知元素的数量 和类型的数组,各元素的类型不必相同。
七、对象类型与索引签名
1、对象类型
基本用法,对象值与定义的类型保持一致。
用?的方式,表示内容可选
2、 索引签名
注意:用索引签名的方式,处理多出来的数据,不报错
对象写法:
数组写法:
八、函数类型与void类型
1、TS中要求,实参的个数与形参的个数必须相同
2、定义函数返回值的类型
3、函数表达式
写法1:
写法2:类型注解
4.void类型,表示函数没有任何返回值的类型
注意:void类型有3种写法,第一是什么都不写,第二是只写一个return,第三是return undefined
九、函数重载与可调用注解
注意:函数重载是指函数约束传入不同的参数,返回不同类型的数据,而且可以清晰的知道传入不同的参数得到不同的结果。
1、函数重载
例子1:
例子2:
2、可调用注解
例子1:
例子2:针对函数重载进行类型注解
例子3:
十、枚举类型与const枚举
注意:枚举是组织收集有关集合的一种方式,使代码更加易于阅读.枚举具备特性:1.自动累加、2.反向映射、3.类型方式、4.const枚举
例子1:简单枚举
1、自动累加
2、反向映射
注意:只有值为数字时,才能反向和累加。
十一、接口与类型别名之间的区别
注意:接口是一系列抽象方法的声明,是一些方法特征集合。简单说,接口的作用就是为这些类型命名和为你的代码或是第三方代码定义契约。
1、接口interface
接口的基本应用
例子1:
例子2:
例子3:
2、接口interface和类型别名的区别type
1.写法不同
2.接口具备合并功能,type不具备
3.接口具备继承能力,type不具备
4、type具备映射类型,interface不具备
十二、字面量类型和keyof关键字
注意:在TS中可以把字面量作为具体的类型来使用,当使用字面量作为具体类型时,该类型的取值就必须是该字面量的值。
例子1:
例子2:
将interface变成字面量类型
例子3:
十三、类型保护与自定义类型保护
注意: 类型保护允许你使用更小的范围下的对象类型
1、typeof
2、in
3、instanceof
4、字面量
4、自定义类型保护is
十四、定义泛型和泛型常见操作
注意:泛型是指在定义函数、接口或类时,未指定其参数类型,只有在运行时传入才能确定。
1、基本用法
2、泛型默认值
3、数组泛型
4、函数泛型
5、函数与接口结合
例子:
6、泛型类用法
7、继承中写泛型
8、泛型约束
十五、映射类型与内置工具类型
注意:映射类型只能用别名实现,不能用接口来实现
1、只读Readonly
2、可选的Partial
3、 筛选出Pick
4、修改类型Record
5、从可选项变成必选项RequiredÏ
5、排除掉某一项Omit
十六、条件类型和infer关键字
注意:条件类型就是在初始状态并不直接确定具体类型,而是通过一定的类型运算得到最终的变量类型。
1、排除类型 Exclude
2、