接口类型的一个作用是将内联类型抽离出来,从而实现类型可复用。其实,我们也可以使用类型别名接收抽离出来的内联类型实现复用。格式:type 别名名称 = 类型定义。
1. 基础使用
type PersonInfo = { name: string; age: number };
let zs: PersonInfo = {
name: "张三",
age: 20,
};
type跟interface差不多,都可以自定义类型,但是type不能重名
2. 特定使用场景
大家可能觉得这个和接口没多大区别,这不是重复了吗?其实不是,类型别名可以针对接口没法覆盖的场景,例如组合类型、交叉类型等;
// 1. 组合类型
type NumAndString = number | string;
// 2. 交叉类型
type SectionType = { name: string; age: number } & {
height: number;
name: string;
};
interface PersonInfo {
name: string;
height: number;
}
// 3. 我们可以这样子拿接口定义的类型
type PersonHeight = PersonInfo["height"];//这里拿了PersonInfo接口中的height类型
let zs: SectionType = {
name: "张三",
age: 20,
height: 180,
};
// 黑魔法
type BorderColor = 'black' | 'red' | 'green' | 'yellow' | 'blue' | string & {}; // vscode提示字面类型都被保留
3. Interface 与 Type 的区别
实际上,在大多数的情况下使用接口类型和类型别名的效果等价,但是在某些特定的场景下这两者还是存在很大区别。
- 重复定义的接口类型,它的属性会叠加,这个特性使得我们可以极其方便地对全局变量、第三方库的类型做扩展
- 如果我们重复定义类型别名,那么就会报错