如何避免继承类时误重写父类方法并捕获意外重写错误

TypeScript 静态校验方案（推荐） #

TypeScript 4.3及以上版本原生支持该能力，通过配置编译选项即可实现，开发阶段就能直接捕获错误，无需到运行时触发：

1. 在tsconfig.json中开启noImplicitOverride配置项

{
  "compilerOptions": {
    "noImplicitOverride": true
  }
}

2. 规则效果完全匹配需求：

• 子类意外重写父类方法时，没有加override关键字会直接抛出编译错误
• 有意重写只要给方法加上override注解即可正常编译
  代码示例：

class SomeComponent {
  show() {
    // ...
  }
}

class SpecializedComponent extends SomeComponent {
  // 此处编译报错：意外重写父类方法，未添加override关键字
  show() { 
    // ...
  }

  // 有意重写添加override后正常编译
  override show() {
    // ...
  }
}

JavaScript 运行时校验方案 #

如果使用纯JS环境，可以通过父类构造函数做运行时校验，约定有意重写的方法需要添加指定标记：

class SomeComponent {
  constructor() {
    const parentProto = Object.getPrototypeOf(this.constructor).prototype;
    const childProto = Object.getPrototypeOf(this);
    const parentMethodNames = new Set(Object.getOwnPropertyNames(parentProto));

    // 遍历子类所有自有方法校验重写逻辑
    Object.getOwnPropertyNames(childProto).forEach(methodName => {
      if (methodName === 'constructor' || !parentMethodNames.has(methodName)) return;
      // 检查是否有显式的重写标记
      if (!childProto[methodName].isOverride) {
        throw new Error(`检测到意外重写父类方法 ${methodName}，有意重写请给方法添加isOverride标记`);
      }
    })
  }

  show() {
    // ...
  }
}

class SpecializedComponent extends SomeComponent {
  // 意外重写，实例化时会抛出错误
  show() {
    // ...
  }
}

// 有意重写添加标记即可
class LegalSpecializedComponent extends SomeComponent {
  show() {
    // ...
  }
}
LegalSpecializedComponent.prototype.show.isOverride = true;

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