请问Class<A | B>与Class<A> | Class<B>的TypeScript类型定义有差异吗？

首先明确给定的类型定义：

export type Class<T> = new (...args: any[]) => T;

这个类型表示任意能构造出T类型实例的构造函数，参数列表不限。

两者存在明显差异，具体如下：

1. 本质类型不同 #

• Class<A | B>：代表一个单一的构造函数类型，调用这个构造函数后，会返回A或B类型的实例（具体是哪种类型在编译期无法确定）。
• Class<A> | Class<B>：代表两种构造函数的联合类型，这个类型的值要么是能构造A实例的构造函数，要么是能构造B实例的构造函数，本身是两种类型二选一。

举个代码例子更直观：

class A { a: string = "a" }
class B { b: number = 1 }

// 符合Class<A | B>的构造函数：一个构造函数，根据参数返回不同类型实例
const MixedConstructor: Class<A | B> = class {
  constructor(isA: boolean) {
    if (isA) {
      (this as unknown as A).a = "a";
    } else {
      (this as unknown as B).b = 1;
    }
  }
};
const mixedInstance = new MixedConstructor(Math.random() > 0.5);
// mixedInstance 的类型是 A | B

// 符合Class<A> | Class<B>的构造函数：二选一的构造函数
const SingleConstructor: Class<A> | Class<B> = Math.random() > 0.5 ? A : B;
const singleInstance = new SingleConstructor();
// singleInstance 的类型也是 A | B，但SingleConstructor本身是A或B的构造器之一

2. 赋值兼容性不同 #

• Class<A>/Class<B>可以赋值给Class<A | B>：因为构造函数的返回值是协变的，A和B都是A | B的子类型，所以能生成A/B实例的构造器，自然也符合“能生成A|B实例”的要求。
• Class<A | B>不能赋值给Class<A> | Class<B>：像上面例子中的MixedConstructor，它既不是Class<A>也不是Class<B>（因为它的返回值不是单一的A或B），所以无法被赋值给Class<A> | Class<B>类型的变量。

3. 使用场景不同 #

• 当你需要一个能灵活生成两种类型实例的单一构造器时，选择Class<A | B>；
• 当你需要表示“要么用A的构造器，要么用B的构造器”的二选一场景时，选择Class<A> | Class<B>。

内容的提问来源于stack exchange，提问作者Ella