TypeScript中如何通过类引用访问静态属性规避编译报错

报错核心原因 #

• 类型转换错误：AbsClass是类的实例类型，而静态属性挂载在类的构造函数对象上，对应的类型应为typeof AbsClass，你将构造函数转为实例类型自然无法识别静态属性。
• TypeScript对protected静态成员的访问限制：protected静态成员仅允许通过类名直接访问，不允许通过任意构造函数引用访问，哪怕类型正确也会触发权限报错。
• 运行时可正常访问是因为JS原生无访问权限限制，constructor本身指向类的构造函数对象，静态属性直接挂载在该对象上。

可行解决方案 #

所有方案均满足动态获取构造函数访问属性、无需写死类名的需求。

方案1：调整类型断言绕开检查 #

直接将构造函数断言为包含alias属性的结构，既修正类型也绕开protected访问校验：

getAlias(obj?: AbsClass) {
  const accessClass = (obj?.constructor ?? this.constructor) as { alias?: string };
  return accessClass.alias;
}

方案2：抽象类封装统一获取方法（更规范） #

在抽象基类中提前封装实例层面获取静态属性的方法，后续所有子类都可以直接调用：

abstract class AbsClass {
  protected static alias?: string;
  // 封装实例获取当前类静态alias的方法
  getClassAlias() {
    return (this.constructor as typeof AbsClass).alias;
  }
}

class Derived extends AbsClass {
  protected static alias = "drv";
  getAlias(obj?: AbsClass) {
    return obj?.getClassAlias() ?? this.getClassAlias();
  }
}

方案3：调整访问修饰符 #

如果业务允许，直接将static alias的修饰符从protected改为public，修正类型断言为typeof AbsClass后即可直接访问：

abstract class AbsClass {
  public static alias?: string;
}

// 后续getAlias写法
getAlias(obj?: AbsClass) {
  const accessClass = (obj?.constructor ?? this.constructor) as typeof AbsClass;
  return accessClass.alias;
}

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