TypeScript 学习笔记 — 交叉类型、条件类型和条件分发（八）
目录
交叉类型
交叉类型（交集）会把多个类型变成一个类型，相当于 & 按位与操作 （都要满足才可以）,生成的交叉类型 是 A B 的子类 ，内部的嵌套类型也会做交叉类型。
联合类型（并集）相当于| 按位或，满足其中一个就可以。
interface Person1 {
handsome: string;
address: {
n: string;
};
}
interface Person2 {
high: string;
address: {
n: number;
};
}
type Person = Person1 & Person2; // 交叉类型
type a = string | number; // 联合类型
type Temp = Person["address"]["n"]; // type Temp = never
合并两个对象，相同的属性类型会变成 never, 交叉后的结果涵盖所有内容
function mixin<T, U>(a: T, b: U): T & U {
return { ...a, ...b };
}
type Compute<T> = { [P in keyof T]: T[P] };
let r = mixin({ a: 1, b: 2 }, { c: 3, b: "2" });
type x = Compute<r>; // type x = { a: number; b: never; c: number;}
条件类型
泛型 extends 约束经常和条件类型一起 使用，条件类型的格式可以看成是三元表达式：
1. 直接传入判断的条件
// 联合类型而言子类型是其中的任何一个
type ResStatusMessage<T> = T extends 200 | 201 | 204 | 206 ? "success" : "fail";
type IMessage1 = ResStatusMessage<300>; // type IMessage1 = "fail"
type IMessage2 = ResStatusMessage<200>; // type IMessage1 = "success"
2. 把条件当成泛型传入
// 泛型在条件类型中广泛被应用
type Conditional<T, U> = T extends U ? true : false;
type R1 = Conditional<"yya", string>; // type R1 = true
type R2 = Conditional<"yya", number>; // type R2 = false
3. 多重条件判断
简单的案例解析：1 + 2 = 3，添加类型
// 如果是字符串 返回字符串， 如果是number返回number 两者都不是返回nerver
type FromatReturnValue<T> = T extends string ? string : T extends number ? number : never;
function sum<T extends string | number>(a: T, b: T): FromatReturnValue<T> {
return a + (b as any); // 泛型之间不能做运算;
}
let r1 = sum(1, 2); // number
let r2 = sum("1", "2"); // string
4. 判断接口中的类型
interface Fish {
name: "鱼";
}
interface Water {
type: "水";
}
interface Bird {
name: "鸟";
}
interface Sky {
type: "太空";
}
type SelectType<T> = T extends Fish ? Water : Sky;
type R3 = SelectType<Bird>; // type R3 = Sky
extends 父子关系（类型等级）
- never 类型是字面量类型的子类型(never 底端类型 最底层的)
- 字面量类型是基础类型的子类型
- 基础类型是包装类型的子类型(所有包装类型的上一层都是 Object)
- 所有类型都是 any 和 unknown 的子类型
- 其他类型 null、undefined、void
- 子类型可以赋予给父类型
// 1. never是字面量类型的子类型
type T1 = never extends "123" ? true : false;
let a: number = (function (): never {
throw new Error();
})();
// 2. 字面量类型 是基础类型的子类型
type T2 = 123 extends number ? true : false;
type T3 = "abc" extends string ? true : false;
// 3. 基础类型是包装类型的子类型
type T4 = string extends String ? true : false;
type T5 = String extends Object ? true : false;
// 4. 所含有类型都是 any 和 unknown 的子类型
type T6 = any extends any ? true : false; // type T6 = true
type T7 = any extends unknown ? true : false; // type T7 = true
type T8 = any extends 1 ? true : false; // type T8 = boolean any 可以看成 1 + 其它类型（内置有分发的机制）直接取最终的联合类型
type T9 = any extends 1 ? 1 : 2; // type T9 = 1 | 2
type T10 = unknown extends 1 ? true : false; // type T10= false
// 5. 其他类型 null、undefined、void
type T11 = null extends null ? true : false;
type T12 = undefined extends undefined ? true : false;
type T13 = undefined extends void ? true : false;
条件分发机制
分发机制触发条件：
- 通过泛型传入的方式来比较时会出现分发
- 类型是联合类型
- 类型需要完全的裸露出来(裸类型)
简单的案例解析： 类型(联合类型)的比较 (分发)
interface Fish {
name: "鱼";
}
interface Water {
type: "水";
}
interface Bird {
name: "鸟";
}
interface Sky {
type: "太空";
}
type SelectType<T> = T extends Fish ? Water : Sky;
// 这里会用每一项依次进行分发,最终采用联合类型作为结果,等价于:
/** 对比过程
* Bird -> Fish -> Sky
* Fish -> Fish -> Water
* Sky | Water
*/
type T1 = SelectType<Bird | Fish>; // type T1 = Water | Sky
// 如果上述泛型换一种写法，使其并非裸类型，结果会是怎么样呢？
type SelectType_2<T> = T[] extends Fish[] ? Water : Sky; // 外面包一层，使其并非裸类型
type SelectType_3<T> = T & {} extends Fish ? Water : Sky; // 外面包一层，使其并非裸类型
type T2 = SelectType_2<Bird | Fish>; // type T2 = Sky
type T3 = SelectType_3<Bird | Fish>; // type T3 = Sky
实际开发中如何避免？
<T,U>判断 T 是不是 U 的子类型？
<T,U>判断 T 是不是 U 的子类型：<1|2, 1|2|3> <1|2|3, 1|2>，实际开发时，由于分发机制返回 boolean，并没有实际意义：
// 是泛型，是联合类型，是裸类型，会触发分发机制
type UnionAssets<T, U> = T extends U ? true : false;
type T1 = UnionAssets<1 | 2, 1 | 2 | 3>; // true
type T2 = UnionAssets<1 | 2 | 3, 1 | 2>; // true | true | false -> boolean
// 包了一层，并非裸类型,表示不分发
type NoDistrubte<T> = T & {};
type UnionAssets_1<T, U> = NoDistrubte<T> extends U ? true : false;
type T3 = UnionAssets_1<1 | 2, 1 | 2 | 3>; // true
type T4 = UnionAssets_1<1 | 2 | 3, 1 | 2>; // false
判断两个类型完全相等？
通过正反 extends，判断自身与其他类型是否相等
// 包了一层，并非裸类型,表示不分发
type NoDistrubte<T> = T & {};
type IsEqual<T, U, Success, Fail> = NoDistrubte<T> extends U ? (NoDistrubte<U> extends T ? Success : Fail) : Fail;
type T1 = IsEqual<1 | 2, 2 | 1, true, false>; // true
type T2 = IsEqual<1 | 2 | 3, 2 | 1, true, false>; // false
never 分发问题
- any 默认分发
- never 默认只有在通过泛型传递时 会返回 never，不分发就正常
type T1 = any extends any ? true : false; // true
type T2 = any extends 1 ? true : false; // boolean 可以看成 1 + 其它类型，直接取最终的联合类型
type T3 = any extends 1 ? 1 : 2; // 1 | 2
type NoDistrubte<T> = T & {};
type isNever<T> = T extends never ? true : false;
type isNever_2<T> = NoDistrubte<T> extends never ? true : false;
type T4 = isNever<never>; // never
type T5 = isNever_2<never>; // true
内置的条件类型
1.Exclude 排除类型(差集)
type Exclude<T, U> = T extends U ? never : T; // 自己实现 never | never | boolean
type ExcludeResult = Exclude<string | number | boolean, string | number>;
2.Extract 抽取类型(交集)
type Extract<T, U> = T extends U ? T : never; // 自己实现 string | number | never
type ExtractResult = Extract<string | number | boolean, string | number>;
3.NoNullable 非空检测
如果类型中包含 null ，就去掉
let ele = document.getElementById("root");
// type NonNullable<T> = T & {}; // 源码写法
type NonNullable<T> = T extends null | undefined ? never : T; // 自己实现
type EleElement = NonNullable<typeof ele>;
4. Complement 自己实现 (补集)
含义就是互补的 = 差集 + 子类的关系
type Complement<T, U extends T> = T extends U ? never : T; // never | number | boolean
type ComplementResult = Complement<string | number | boolean, string>;
