Question

我试图了解继承如何在JavaScript中起作用。我对“ this”关键字的行为感到很困惑。

我提供了我想了解的显示类关系的实际代码。

class AAA {
  xxx() {
    return 2;
  }

  yyy() {
    return 2;
  }

  zzz() {
    return this.xxx() / 2;
  }
}

class BBB extends AAA {
  xxx() {
    return super.xxx() * 2;
  }
}

class CCC extends BBB {
  yyy() {
    return super.yyy() + this.xxx();
  }
  www() {
    return this.xxx() - this.zzz();
  }
}

class DDD extends AAA {
  yyy() {
    return super.yyy() + this.xxx();
  }
  www() {
    return this.zzz() * this.yyy();
  }
}

let c = new CCC();

console.log(c.www()); // 2

首先，我将以我的理解进行解释。如果我错了，请纠正我。另外，如果您不介意的话，那么为了简单起见，我们同意“->”的意思是“指”。

1 c.www() -> CCC.www()
2 CCC.www() -> return this.xxx() - this.zzz()
3     this.xxx() -> BBB.xxx()
4         BBB.xxx() -> return super.xxx() * 2
5             super.xxx() -> AAA.xxx()
                4
6     this.zzz() -> AAA.zzz()
7        AAA.zzz() -> return this.xxx() / 2
8            this.xxx() -> BBB.xxx()
9                BBB.xxx() -> return super.xxx() * 2
10                   super.xxx() -> AAA.xxx()
                        2
// 4 - 2 = 2

如果我的解释是正确的。然后在第2行上，this.xxx()和this.zzz()如何引用父类？另外，在第7行上，this.xxx()是如何引用BBB类的？

Answer 1

所有JavaScript对象都有一个原型。您可以将其视为指向另一个对象的隐藏链接（或根据您的环境可见），以解析对未直接在对象本身上定义的任何属性（包括函数）的引用。

我发现类语法（实际上只是糖）暗示了基于类的继承，因此使隐藏的真实机制混乱。

虽然很旧，但我仍然认为这是最好的解释之一：
http://sporto.github.io/blog/2013/02/22/a-plain-english-guide-to-javascript-prototypes/

我也将读到Eric Elliot关于继承的任何文章。

“ this”如何指代父类？

1 个答案: