在javascript中与类中的实例级变量一起使用时，会丢失此关键字的值

Question

我有两个类，其中一个是父类，另一个是子类类中声明的字段中使用this关键字来访问子类别实例级变量的值。但当我尝试这样做时，它会返回undefined。有人能解释一下这里可能出了什么问题吗。下面我粘贴了一个代码片段供您参考。谢谢

class Parent {
someField = {
someValue: 'Values are ::: '+ this.value1 + ' ' + this.value2,
childType2: "Some gibberish"
}
initialize(childType1) {
this.someField = this.someField[childType1];
}
}
class Child extends Parent {
value1 = "someValue 1"
value2 = "someValue 2"
} 
const child = new Child();
child.initialize("someValue");
console.log(child.someField);

Answer 1

这不是this错了，而是时间问题。初始化someField的代码作为Parent构造函数的一部分运行，在初始化value1和value2的代码运行(作为Child构造器的一部分(之前。所以你在阅读它们时会得到undefined。

公共字段在JavaScript中的工作方式是，字段声明定义的属性定义成为构造函数代码的一部分，就像您在构造函数开始时(在对super的任何调用之后(编写它一样(但使用Object.defineProperty[有效]，而不仅仅是简单的赋值；详细信息(。也就是说，您的代码实际上与以下代码相同：

class Parent {
constructor() {
Object.defineProperty(this, "someField", {
value: {
someValue: 'Values are ::: '+ this.value1 + ' ' + this.value2,
childType2: "Some gibberish"
},
writable: true,
enumerable: true,
configurable: true
});
}
initialize(childType1) {
this.someField = this.someField[childType1];
}
}
class Child extends Parent {
constructor() {
super();
Object.defineProperty(this, "value1", {
value: "someValue 1",
writable: true,
enumerable: true,
configurable: true
});
Object.defineProperty(this, "value2", {
value: "someValue 2",
writable: true,
enumerable: true,
configurable: true
});
}
} 
const child = new Child();
child.initialize("someValue");
console.log(child.someField);