如何在TypeScript中创建含静态属性与构造签名的接口/类型

在TypeScript中，直接用抽象类作为函数参数类型会混淆实例类型和构造函数类型，导致你遇到的编译错误。正确的做法是单独定义一个包含构造签名和静态属性的构造函数类型，具体实现如下：

1. 定义实例接口 #

先保留描述实例行为的接口：

interface IClassType {
  instanceMethod: (param: string) => void;
}

2. 定义构造函数类型 #

用type或interface定义构造函数类型，同时包含静态属性和构造签名：

// 方式一：使用type定义
type ClassConstructor = {
  // 构造签名：接受number参数，返回IClassType实例
  new (param: number): IClassType;
  // 静态必填属性
  requiredProperty: string;
  // 静态可选属性
  optionalProperty?: boolean;
};

// 方式二：使用interface定义（效果完全一致）
// interface ClassConstructor {
//   new (param: number): IClassType;
//   requiredProperty: string;
//   optionalProperty?: boolean;
// }

3. 修改函数参数类型 #

将函数参数类型改为上述构造函数类型，即可正常访问构造函数和静态属性：

const demoFunction = (UserClass: ClassConstructor) => {
  // 正常创建实例
  const demoInstance = new UserClass(3);
  demoInstance.instanceMethod("测试实例方法");

  // 正常访问静态属性
  const demoProp = UserClass.requiredProperty;
  const optionalProp = UserClass.optionalProperty;
};

4. 编写符合类型要求的类 #

只要类满足构造签名和静态属性的要求，就能传入函数：

class MyClass implements IClassType {
  // 实现静态属性
  static requiredProperty = "静态必填属性值";
  static optionalProperty = true;

  // 实现构造函数
  constructor(param: number) {
    // 初始化逻辑
  }

  // 实现实例方法
  instanceMethod(param: string): void {
    console.log(`实例方法被调用：${param}`);
  }
}

// 正常调用函数
demoFunction(MyClass);

为什么之前的抽象类方案不行？ #

你定义的IBaseClass是抽象类，它的类型默认指向实例类型，而非类本身的构造函数类型。当你把UserClass: IBaseClass作为参数时，TypeScript会认为UserClass是IBaseClass的一个实例，而非可以new的构造函数，因此会抛出构造签名不存在、静态属性无法访问的错误。

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