在 javascript 中调用祖父函数

Question

我得到这个class继承结构：

class GrandParent{
  funcA(){
    console.log('GrandParent');
  }
}
class Parent extends GrandParent{
  funcA(){
    console.log('Parent');
  }
}
class Child extends Parent{
  funcA(){
    console.log('Child');
    // how to call funcA of GrandParent -> super.super.funcA()
  }
}

问题是：如何从 Child.funcA() 调用 GrandParent.funcA()？

Child

GrandParent

应该在控制台上登录。

谢谢；

Answer 1

可以通过new GrandParent().funcA();

调用

class GrandParent {
  funcA() {
    console.log('GrandParent');
  }
}
class Parent extends GrandParent {
  funcA() {
    console.log('Parent');
  }
}
class Child extends Parent {
  funcA() {
    console.log('Child');
    new GrandParent().funcA();
  }
}

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

Answer 2

这是矛盾的：您用新的实现覆盖了 GranParent.funcA。如果您需要 GranParent.funcA 的功能，您可能需要稍微分解代码，并根据实际用例根据需要覆盖 Child.funcA。

利用多态性：

class GrandParent {
  doStuff() {
    console.log('some stuff')
  }

  funcA() {
    this.doStuff()
    console.log('GrandParent')
  }
}

class Parent extends GrandParent {
  funcA() {
    console.log('Parent')
  }
}

class Child extends Parent {
  funcA() {
    this.doStuff()
    console.log('child')
  }
}

const child = new Child()
child.funcA()

Answer 3

如果要使用super关键字获取函数。您需要在父函数中调用 super 以指向 class Grandparent.

中的 funcA

class GrandParent{
  funcA(){
    console.log('GrandParent');
  }
}
class Parent extends GrandParent{
  funcA(){
    console.log('Parent');
    super.funcA();
  }
}
class Child extends Parent{
  funcA(){
    console.log('Child');
    super.funcA();

  }
}

var x = new Child();
x.funcA();

Answer 4

如果您确实想使用 super 关键字，这是可能的，但您需要指向适当的原型。换句话说，您应该手动检查 __proto__ 对象链。

class Level1 {
  me() { console.log('Level1'); }
}

class Level2 extends Level1 {
  me() { console.log('Level2'); }
}

class Level3 extends Level2 {
  me() { 
    super.__proto__.__proto__.__proto__.me();
    //      ^         ^         ^ reference to Level1 prototype
    //      |         | reference to Level2 prototype 
    //      | reference to Level3 prototype
    console.log('Level3'); 
  }
}

const foo = new Level3();
foo.me();

但如前所述，可能值得重新考虑逻辑以避免代码中出现这种结构。

在 javascript 中调用祖父函数

Calling grand-parent function in javascript

javascript

inheritance

super

es6-class