TypeScript泛型Mixin函数：实现子类泛型参数自动补全

问题场景 #

现有TypeScript Mixin实现，在固定泛型参数的ClassOK中，hopa方法能正常自动补全参数；但在定义带泛型的ClassKO<T>继承Mixin(ClassA<T>, ClassB)后，实例化ClassKO<"a"|"b">或其子类ClassFinal时，hopa方法无法根据传入的泛型参数自动补全对应值。Mixin需支持多个参数，需修复类型定义以保留泛型推导能力。

原代码 #

// 基础类型定义
type Constructor<T = {}> = new (...args: any[]) => T;
/* 将联合类型转为交叉类型 */
type UnionToIntersection<U> = (U extends any ? (k: U) => void : never) extends ( k: infer I ) => void ? I : never;
/* 合并多个构造函数的实例类型 */
type MergeConstructorTypes<T extends Array<Constructor<any>>> = UnionToIntersection<InstanceType<T[number]>>;

var Mixin = function <T extends Constructor[]>(
  ...mixins: T
): Constructor<MergeConstructorTypes<T>> {
  const MixinSuperClass: Constructor<MergeConstructorTypes<T>> = class {
  } as Constructor<MergeConstructorTypes<T>>;
  return MixinSuperClass;
};

type all = "all1" | "all2";

class ClassA<T extends string = all | "a1" | "a2"> {
  hopa(p: T | all) {
    return 'a' + p;
  }
}

class ClassB {
  hopb(p: all) {
    return 'b' + p;
  }
}

class ClassOK extends Mixin(ClassA<"aa">, ClassB) { }
const c = new ClassOK;
c.hopa("aa"); // 此处"aa"可自动补全

class ClassKO<T extends string = ""> extends Mixin(ClassA<T>, ClassB) { } // Mixin支持任意数量参数
class ClassFinal extends ClassKO<"aaa"> {}
const d = new ClassKO<"a" | "b">;
d.hopa("aa"); // 此处无自动补全，期望能补全"a"/"b"
const de = new ClassFinal;
de.hopa("aaa"); // 此处无自动补全，期望能补全"aaa"

问题根源 #

原Mixin的类型定义未正确保留泛型参数的关联：当ClassA使用泛型T时，MergeConstructorTypes仅合并了实例类型，但未将ClassKO的泛型T传递到ClassA的实例类型中，导致TypeScript无法推导hopa方法的参数类型，进而无法提供自动补全。同时原Mixin仅创建了空类，未复制mixin的原型方法，运行时会丢失hopa和hopb方法。

修复方案 #

调整Mixin的类型定义，确保泛型参数能正确传递，同时补充原型方法的复制逻辑：

// 支持泛型的构造函数类型
type Constructor<T = {}, Args extends any[] = any[]> = new (...args: Args) => T;

// 联合转交叉类型逻辑保持不变
type UnionToIntersection<U> = (U extends any ? (k: U) => void : never) extends (k: infer I) => void ? I : never;

// 合并多个构造函数的实例类型，保留泛型关联
type MergeConstructorTypes<T extends Constructor[]> = UnionToIntersection<InstanceType<T[number]>>;

// 修复后的Mixin函数：合并原型方法 + 保留泛型类型推导
function Mixin<T extends Constructor[]>(...mixins: T): Constructor<MergeConstructorTypes<T>> {
  const MixinSuperClass = class {};
  // 复制所有mixin的原型方法到新类
  mixins.forEach(mixin => {
    Object.getOwnPropertyNames(mixin.prototype).forEach(prop => {
      if (prop !== 'constructor') {
        MixinSuperClass.prototype[prop] = mixin.prototype[prop];
      }
    });
  });
  return MixinSuperClass as Constructor<MergeConstructorTypes<T>>;
}

type all = "all1" | "all2";

class ClassA<T extends string = all | "a1" | "a2"> {
  hopa(p: T | all) {
    return 'a' + p;
  }
}

class ClassB {
  hopb(p: all) {
    return 'b' + p;
  }
}

// 测试固定泛型参数场景
class ClassOK extends Mixin(ClassA<"aa">, ClassB) {}
const c = new ClassOK;
c.hopa("aa"); // 正常自动补全

// 带泛型的子类定义，现在能正确传递泛型参数
class ClassKO<T extends string = ""> extends Mixin(ClassA<T>, ClassB) {}
class ClassFinal extends ClassKO<"aaa"> {}

const d = new ClassKO<"a" | "b">();
d.hopa("a"); // 自动补全"a"、"b"、"all1"、"all2"
d.hopa("all1"); // 正常补全

const de = new ClassFinal;
de.hopa("aaa"); // 自动补全"aaa"、"all1"、"all2"

关键修复点 #

1. 泛型关联保留：通过MergeConstructorTypes正确合并带泛型的实例类型，让ClassKO的泛型T能传递到ClassA的hopa方法参数中，TypeScript可据此推导参数类型并提供自动补全。
2. 运行时方法合并：补充原型方法复制逻辑，确保Mixin生成的类在运行时拥有所有mixin的方法，避免原代码中仅类型正确但实际无方法的问题。
3. 多参数支持：原Mixin的可变参数逻辑保持不变，依然支持传入任意数量的mixin类。

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