逆变与协变是泛型类型中的一个概念,当然不只只是 TS 独有的概念。简单来说,假设存在类型 T2 为 T1 的子类,并且从 T1 派生出新类型 N
class People{
public string getName();
}
class Student extends People{
public string getId();
}
void SayName(People[] manyPeople){
for(People p: manyPeople){
p.sayName();
}
}
SayName(new Student[]); // 支持协变
void SayName(List){
for(People p: manyPeople){
p.sayName();
}
}
SayName(new List()); // 不支持
类型兼容性
当然在 TS 中类型之间不一定存在继承关系,因此当 TS 判断是否为结构化子类型时有一个规则,如果实例 b 能够赋值给实例 a,则 a 中的全部属性需要能在 b 中找到,例如:
type People = {
name: string
}
type Student = {
name: string,
id: number
}
const s: Student = {name: 'lily', id: 5}
const p: People = s // People 的所有属性能在 Student 中找到,可以赋值
const s1: Array = [s]
const p1: Array = s1 // 支持协变
当然在 TS 中还存在非结构化类型的情况,例如:
type ManyName = 'lily'|'bob'|'john'
type Lily = 'lily'
const lily: Lily = 'lily'
const names: ManyName = lily
对于 Lily 可以复制给 ManyName 这个联合类型,因此我们可以将 Lily 视为 ManyName 这个子类型。从结构化类型来看,子类的属性多于父类型。为什么这里的 ManyName 反而是父类型呢。其实无论是否结构化,都可以认为父类型所描述的类型范围更加广泛,而子类型描述的范围更加狭窄,从父类到子类其实是 narrowing 的过程。
逆变
大多数类型兼容都采用协变,但是涉及到函数时会不一样。例如:
type People = {
name: string
}
type Student = {
name: string,
id: number
}
function say(p: People, sayWhat: (p: People) => void){
sayWhat(p)
}
function sayId(s: Student){
console.info(s.id)
}
function sayPeople(s: People){
console.info(s.name)
}
say({name: 'lily'}, sayId)
如果我们采用协变的思想,将 (s: Student) => void 的 sayId 赋值给 (s: People) => void。则意为着在调用 sayId 时可以传入类型为 People 的参数,但是此时 sayId 明显时需要更多属性的 Student 类型的参数。因此当比较两个函数类型是否兼容时,函数参数为逆变。我们可以将 sayPeople 赋值给类型为 (s: Student) => void,因为这表示 sayPeople 所接受到的参数类型必定为 Student 及其子类型, 而 Student 及其子类型则一定包含 sayPeople 所需要的 name 属性。
双向协变
在 TS 中,默认是采用双向协变进行兼容,如果将 A 类型的值赋给 B 类型。则只要 A 能协变为 B 或者 B 能协变为 A 即可。如果需要严格的逆变方式兼容,可以在 tsconfig.json 中声明:
{
"compilerOptions": {
"strictFunctionTypes": true
},
}
TS 的解释为,我们在声明某个方法时可能会使用更广泛的类型,但是实际使用的时候则会传入更详细的子类型。例如:
interface MyEvent{
type: string
}
interface MyMouseEvent extends MyEvent{
x: number,
y: number
}
declare function on(eventName: string, callBack: (event: MyEvent) => void): void
on('mouse', (event: MyMouseEvent) => console.info(`${event.x} : ${event.y}`))
也就是说虽然声明了需要一个 (event: MyEvent) => void 类型的回调,但是当调用这个回调时,依旧会传入 MyMouseEvent 类型的 event。这在 js 中是非常常见的模式,也一般不会有什么错误。如果只支持逆变,那么可能会有大量的样本代码:
on('mouse', (event: Event) => {
const e = (event as unknown) as MyMouseEvent // 先转换成实际传入的类型
console.info(`${e.x} : ${e.y}`)
})
函数兼容性还有另一种情况:
type sayName = (name: string) => void
type sayNameAndId = (name: string, id: number) => void
let sn: sayName;
let sni: sayNameAndId;
sn = sni; // 不支持
sni = sn; // 支持
其实也可以看作为逆变,即可以将类型更广泛的 sn 赋值给类型更狭窄的 sni。但是反过来却不支持。其实这种模式在 js 中也很常用,例如 array 的 forEach 方法本身定义为:
forEach((element, index, array) => { /* ... */ })
当然也可以传递只有一个参数的函数如:
forEach(x => console.info(x))
逆变协变对 infer 的影响
简单一句话来说就是 infer 处于逆变位置推断类型为交叉类型,处于协变位置推断出类型为联合类型:
interface Foo{
bar1(name: string): string,
bar2(name: number): number
}
type BAR = T extends {
bar1: (name: infer R) => infer Y,
bar2: (name: infer R) => infer Y,
} ? [R, Y] : never
type BBB = BAR // [never, string|number]. 第一个 never 是因为 string & number = never
这个只是还对应一个非常经典的一道题:
https://github.com/type-challenges/type-challenges/blob/master/questions/55-hard-union-to-intersection/README.md
type UnionToIntersection =
(U extends unknown ? (arg: U) => unknown : never) extends ((arg: infer P) => unknown) ? P : never;