访问器属性中为什么不能用this调用本属性？

访问器属性是ES6中引入的新特性，它允许我们通过getter和setter方法来拦截属性的取值和赋值操作。这使得我们可以对数据的访问和修改进行额外的控制和处理。

然而，在使用访问器属性时，我们需要注意一点，那就是不能在getter或setter方法中使用this来调用本属性。这是因为，在getter和setter方法中，this关键字并不指向当前对象，而是指向getter或setter方法本身。

例如，我们定义了一个访问器属性name，如下所示：

class Person {
  get name() {
    // 这里不能使用 this.name
    return this.firstName + ' ' + this.lastName;
  }

  set name(value) {
    // 这里不能使用 this.name
    const parts = value.split(' ');
    this.firstName = parts[0];
    this.lastName = parts[1];
  }
}

如果我们试图在getter或setter方法中使用this.name，就会报错，如下所示：

Uncaught TypeError: Cannot read property 'name' of undefined

这是因为，在getter和setter方法中，this关键字并不指向Person类的实例，而是指向getter或setter方法本身。因此，this.name是undefined，无法访问。

为了解决这个问题，我们可以使用一个临时变量来存储本属性的值，然后在getter和setter方法中使用这个临时变量。例如，我们可以将上面的代码修改为如下所示：

class Person {
  constructor(firstName, lastName) {
    this._name = firstName + ' ' + lastName;
  }

  get name() {
    return this._name;
  }

  set name(value) {
    const parts = value.split(' ');
    this.firstName = parts[0];
    this.lastName = parts[1];
    this._name = value;
  }
}

这样，我们就可以在getter和setter方法中使用this._name来访问和修改本属性的值，而不会报错。

需要注意的是，这种方法仅适用于数据属性。对于访问器属性，我们不能使用this._name来访问和修改本属性的值。这是因为，访问器属性的值是通过getter和setter方法来获取和设置的，而不是通过直接访问属性本身。