为什么在构造函数内部的函数中未定义'this'的值？

Question

出于实践目的，我正在尝试在Node.js中实现自己的Promise版本。我得到的结果我不明白。我创建了以下代码来说明问题所在。

class Person {
  constructor(name) {
    this.name = name

    // console.log(this)

    function sayName() {
      console.log(this.name)
    }

    sayName()
  }
}

const joe = new Person('Joe')

我收到错误消息'TypeError：无法读取未定义的属性'名称''。当我调用构造函数时，“ this”的值是新创建的对象，因此，如果我取消注释行，则将在该行注销正在创建的对象。

当我调用sayName函数时，我希望'this'的值为全局对象。在大多数情况下，我可以肯定地假设，当您开始定义新函数时，“ this”的值就是全局对象。但是这里是'undefined'，因此我得到了错误消息。

如果我在不使用class关键字的情况下进行了同样的操作，并且将sayName函数放置到构造函数中，它的行为将与预期的一样，并记录为'undefined'，因为在全局对象上没有定义name属性。

function Person(name) {
  this.name = name

  function sayName() {
    console.log(this.name)
  }

  sayName()
}

const joe = new Person('Joe')

我知道使用class关键字时会触发一些安全机制。我最好的猜测是，这两个示例中的一个之间的差异（其中一个是在我不知道的情况下触发的）。

请告诉我是什么原因造成的，为什么在第一个示例中未定义'this'的值！谢谢

Answer 1

当在构造函数中定义函数声明function() {}时，会失去this上下文。我想这与constructor在幕后的实现方式有关。您可以使用

将其添加回去

sayName = sayName.bind(this);
sayName();

或者也许更好的方法是只在构造函数中不定义函数，并将其定义为类方法：

sayName() {
  return this.name;
}