如何为存储派生类的变量正确添加TypeScript类型

你遇到的问题核心是：要存储的是类的构造函数而非实例，原来的handler: Base类型标注错误，因为Derived是类本身（构造函数），不是Base的实例对象。

正确的类型标注方式 #

有两种等价的方式可以定义handler的类型：

方式1：使用构造函数签名

直接定义一个能生成Base实例的无参构造函数类型：

interface OneNode {
  handler: new () => Base;
}

方式2：使用typeof Base

抽象类的typeof类型就是其构造函数类型，同样能匹配所有派生类的构造函数：

interface OneNode {
  handler: typeof Base;
}

修正后的完整代码 #

abstract class Base {
  constructor() {
    console.log("Base");
  }

  abstract fun(): void; // 补充返回类型，提升代码规范性
}

class Derived extends Base {
  constructor() {
    super();
    console.log("Derived");
  }

  fun() {
    console.log("Have fun");
  }
}

interface OneNode {
  handler: new () => Base; // 二选一即可
}

const availableNodes: OneNode[] = [
  { handler: Derived } // 不再报错
];

// 正常实例化并调用方法
const y = new availableNodes[0].handler();
y.fun();

原理说明 #

• new () => Base表示一个无参数的构造函数，调用后返回Base类型的实例，所有继承Base的派生类构造函数都满足这个约束。
• typeof Base对应抽象类Base的构造函数类型，派生类的构造函数天然继承了Base的构造签名，因此也能匹配这个类型。

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