TypeScript数组类实例化时构造参数意外变为交集类型的解决方法

现有一组继承自Animal的类，计划通过静态方法slug匹配并初始化对应类，同时匹配其构造参数。但实例化时构造参数类型被推断为DogParams & CatParams交集类型，而非预期的DogParams | CatParams联合类型，导致类型校验错误。代码示例如下：

interface AnimalParams {
  name: string;
  color: string;
}

class Animal {
  params: AnimalParams;
  constructor(params: AnimalParams) {
    this.params = params;
  }
}

interface DogParams extends AnimalParams {
  species: string;
}

class Dog extends Animal {
  params: DogParams;
  constructor(params: DogParams) {
    super(params);
    this.params = params;
  }

  static slug(): string {
    return "dog";
  }
}

interface CatParams extends AnimalParams {
  sound: "meow";
}

class Cat extends Animal {
  params: CatParams;
  constructor(params: CatParams) {
    super(params);
    this.params = params;
  }

  static slug(): string {
    return "cat";
  }
}

const arr = [Dog, Cat];
const args = {
   dog: DogParams, 
   cat: CatParams
}

const animal = arr.find((x) => x.slug() === "dog");
if (!animal) {
  throw new Error("not found");
}
// 报错：Property 'sound' is missing in type '{ name: string; color: string; species: string; }' but required in type 'CatParams'.
// 构造参数被推断为 DogParams & CatParams
const a = new animal(args[animal.slug()]);

问题原因 #

TypeScript对联合类型的构造函数参数采用逆变处理：当你拥有Dog | Cat类型的构造函数时，它的参数会被推断为DogParams & CatParams（因为只有同时满足两个类型的参数才能被联合类型中的任意构造函数接受），这和我们期望的“对应类匹配对应参数”的映射关系不符。

修复方案 #

核心是建立Slug-类-参数的明确类型映射，让TypeScript能根据Slug准确推断对应的构造参数类型，而非模糊的联合类型。

步骤1：定义类型映射表 #

先创建一个类型，把每个Slug对应的类和参数关联起来：

// 定义Slug与类、参数的映射
type AnimalMap = {
  dog: {
    Class: typeof Dog;
    Params: DogParams;
  };
  cat: {
    Class: typeof Cat;
    Params: CatParams;
  };
};

// 提取所有Slug类型
type AnimalSlug = keyof AnimalMap;

步骤2：约束类数组与参数对象 #

用AnimalMap约束类数组和参数对象的类型，确保两者的Slug对应关系一致：

// 类数组：从AnimalMap中提取所有Class类型
const animalClasses: Array<AnimalMap[AnimalSlug]["Class"]> = [Dog, Cat];

// 参数对象：键为Slug，值为对应参数类型的具体实例（注意不能直接存接口，要存实际参数值）
const animalParams: { [K in AnimalSlug]: AnimalMap[K]["Params"] } = {
  dog: { name: "旺财", color: "yellow", species: "中华田园犬" },
  cat: { name: "咪咪", color: "white", sound: "meow" },
};

步骤3：编写类型安全的工厂函数 #

创建一个工厂函数，根据Slug返回对应的实例，利用类型断言和映射关系确保类型正确：

function createAnimal<K extends AnimalSlug>(slug: K): AnimalMap[K]["Class"]["prototype"] {
  const AnimalClass = animalClasses.find(cls => cls.slug() === slug) as AnimalMap[K]["Class"];
  if (!AnimalClass) {
    throw new Error(`Animal with slug ${slug} not found`);
  }
  return new AnimalClass(animalParams[slug]);
}

// 类型正确：a的类型是Dog，参数是DogParams
const a = createAnimal("dog");
// 类型正确：b的类型是Cat，参数是CatParams
const b = createAnimal("cat");

简化版（无需工厂函数） #

如果不需要复用逻辑，也可以直接通过类型断言明确当前匹配的类对应的参数类型：

const targetSlug = "dog" as AnimalSlug;
const AnimalClass = animalClasses.find(cls => cls.slug() === targetSlug) as AnimalMap[typeof targetSlug]["Class"];
if (!AnimalClass) {
  throw new Error("not found");
}
const a = new AnimalClass(animalParams[targetSlug]);

这样就能确保构造参数类型和类一一对应，不会出现交集类型的错误。

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