如何在TypeScript中实现‘动态’声明合并？

我太懂你这种困扰了——想用函数动态给类扩展属性或方法，但TypeScript自带的声明合并又太死板，还要让使用这段代码的人额外写一堆声明，着实麻烦。别担心，咱们可以用泛型结合高阶类函数的方式来实现“动态”的类型安全扩展，完全不用依赖静态的声明合并。

核心思路 #

写一个高阶函数，它接收你的基础类和返回扩展对象的函数：

• 运行时：把扩展对象的属性/方法挂载到类的原型（或类本身，如果是静态属性）上
• 类型层面：通过TypeScript的泛型和交叉类型，让编译器自动推断出扩展后的类的完整类型，不需要使用者额外写任何声明

基础实现示例 #

先看一个简单的版本，给类的实例扩展方法：

// 定义一个返回扩展对象的函数
function getInstanceExtensions() {
  return {
    greet: () => console.log('Hello from extension!'),
    doubleNumber: (num: number) => num * 2
  };
}

// 实现扩展类的高阶函数
function extendClass<
  Base extends new (...args: any[]) => any,
  Ext extends object
>(
  BaseClass: Base,
  getExtension: () => Ext
): Base & { new (...args: ConstructorParameters<Base>): InstanceType<Base> & Ext } {
  // 把扩展对象的属性复制到基础类的原型上（实例属性/方法）
  Object.assign(BaseClass.prototype, getExtension());
  
  // 类型断言让TypeScript识别扩展后的构造函数类型
  return BaseClass as Base & { new (...args: ConstructorParameters<Base>): InstanceType<Base> & Ext };
}

// 测试用的基础类
class User {
  username: string;
  constructor(username: string) {
    this.username = username;
  }
}

// 生成扩展后的类
const ExtendedUser = extendClass(User, getInstanceExtensions);

// 使用时TypeScript能自动识别扩展的方法
const user = new ExtendedUser('Alice');
user.greet(); // 正常调用，无类型错误
console.log(user.doubleNumber(5)); // 输出10，类型完全匹配

支持带参数的动态扩展 #

如果你的扩展内容需要根据参数动态生成，也可以调整高阶函数来支持传递参数给扩展函数：

// 带参数的扩展函数
function getInstanceExtensions(greetingPrefix: string) {
  return {
    greet: function () {
      console.log(`${greetingPrefix}, I'm ${this.username}`);
    },
    multiply: (num: number, factor: number) => num * factor
  };
}

// 调整后的extendClass函数，支持传递参数给扩展函数
function extendClass<
  Base extends new (...args: any[]) => any,
  Ext extends object,
  ExtArgs extends any[]
>(
  BaseClass: Base,
  getExtension: (...args: ExtArgs) => Ext,
  ...extensionArgs: ExtArgs
): Base & { new (...args: ConstructorParameters<Base>): InstanceType<Base> & Ext } {
  Object.assign(BaseClass.prototype, getExtension(...extensionArgs));
  return BaseClass as Base & { new (...args: ConstructorParameters<Base>): InstanceType<Base> & Ext };
}

// 使用示例
const ExtendedUser = extendClass(User, getInstanceExtensions, 'Hi there');
const user = new ExtendedUser('Bob');
user.greet(); // 输出"Hi there, I'm Bob"
console.log(user.multiply(3, 4)); // 输出12

扩展静态属性/方法的情况 #

如果需要给类本身扩展静态属性或方法，只需要调整挂载目标和类型定义：

// 返回静态扩展对象的函数
function getStaticExtensions() {
  return {
    createGuest: () => new User('Guest')
  };
}

// 扩展静态属性的高阶函数
function extendClassStatic<
  Base extends new (...args: any[]) => any,
  Ext extends object
>(
  BaseClass: Base,
  getExtension: () => Ext
): Base & Ext {
  Object.assign(BaseClass, getExtension());
  return BaseClass as Base & Ext;
}

// 使用示例
const ExtendedUser = extendClassStatic(User, getStaticExtensions);
const guestUser = ExtendedUser.createGuest(); // TypeScript能识别createGuest静态方法

方案优势 #

• 零额外声明：使用者不需要手动写接口合并或declare代码，TypeScript自动推断类型
• 高度灵活：扩展内容可以根据参数动态生成，比静态声明合并更适配动态场景
• 封装性强：扩展逻辑都封装在函数里，使用者只需要调用extendClass即可，无需关心类型细节

这样应该就能解决你不想依赖静态声明合并，同时实现动态扩展的需求啦。

内容来源于stack exchange