在构造函数期间未设置继承的 javascript 属性

Question

我有两个 Javascript 类，一个扩展了另一个。

基类有一个属性，该属性被其他类覆盖。

构建子类时，该属性似乎是按照超类设置的。

我尝试搜索此内容，但没有找到任何有用的结果 - 可能我不知道正确的搜索词。

示例：

class A {
  id = "A";
  constructor() {
    this.show();
  }

  show() {
    console.log(this.id);
  }
}
class B extends A {
  id = "B";
}

o = new B();
o.show();

因为我正在构造一个“B”，所以我期望它打印“B”和“B”，但实际上它打印“A”和“B”。

如何在超类构造函数中获取“B”？

Answer 1

这是由于所有属性的添加和初始化顺序所致。它从基类开始，一直到最终的子类。

当您创建

B

时，它首先创建一个

A

，它执行

this.id = 'A'

，然后调用

A

构造函数。这调用

this.show()

，记录

A

。

然后它完成了对象的

B

部分的构造，即

this.id = "B"

。现在，当您调用

o

.show()

, you get the 

B` 输出时。

在构造过程中，您通常必须小心如何操作对象，因为它仍处于中间状态。

Answer 2

所以这是一篇旧帖子，但考虑到答案都有些不正确，我也遇到了同样的问题，我认为它仍然值得知道。

我无法解释到底是什么让它起作用，但 setTimeout 修复了执行上下文。

参见：

class A {
  id = "A";
  constructor() {
      this.show();
      setTimeout(() => {
          this.show();
      }, 0);
  }

  show() {
      console.log(this.id);
  }
}

class B extends A {
  id = "B";
}

o = new B();

我真的相信 JavaScript 是某种黑魔法