Javascript子类方法不重写父类方法

这是 one of few reasons why arrow methods aren't convenient 是的。它们限制了类的扩展和测试方式。

Class fields (哪些箭头方法是)是构造函数代码的语法糖:

class Parent {
  constructor() {
    this.add = () => {...};
  }
}

只有另一个箭头方法可以重写父箭头方法,因为它们是在类构造函数中定义的,而不是在类原型中定义的:

class Child extends Parent {
  add = () => {
    /* no super.add here because add is not prototype method */
  }
}

如果 super.add 要使用,解决方法是存储父方法:

class Child extends Parent {
  superAdd = this.add;
  add = () => {
    this.superAdd();
  }
}

注意,由于这是构造函数代码的语法糖,所以 superAdd 和 add 都是明确的事情。

父母 add 是一个实例属性,它使作为实例原型的子类方法黯然失色。这有点老生常谈,但您可以在构造函数中重命名和删除类属性:

class Parent {
  add = () => {
    console.log('Parent method');
  }
}
class Child extends Parent {
  constructor() {
    super();
    this.parentAdd = this.add;
    delete this.add;
  }

  add() {
    console.log('Child Method');
    this.parentAdd(); // if you need call the parent's method
  }
}

const child = new Child();
child.add();