JavaScript属性下划线命名解惑：构造函数赋值this.name为何有效？

问题描述：这段代码的构造函数接收name参数并赋值给this.name，但名为name的getter返回的是this._name，为什么代码还能正常运行？

class User {
  constructor(name) {
    // 调用setter方法
    this.name = name;
  }

  get name() {
    return this._name;
  }

  set name(value) {
    if (value.length < 4) {
      alert("Name is too short.");
      return;
    }
    this._name = value;
  }
}

let user = new User("John");
alert(user.name); // John

user = new User(""); // Name is too short.

核心原因：this.name = name触发了setter方法 #

当你在类中定义了get name()和set name(value)之后，所有对this.name的读写操作都会自动调用对应的存取器方法，而不是直接操作实例的name属性：

• 构造函数里的this.name = name，本质是调用了set name(value)方法，把参数name传给了setter的value。
• 传入"John"时，setter判断长度≥4，执行this._name = value，把值存在了this._name这个实例属性里。
• 当后续执行alert(user.name)时，调用的是get name()方法，返回之前setter存好的this._name，所以能输出"John"。
• 传入空字符串时，setter触发alert并提前返回，不会给this._name赋值。

额外说明 #

• 用_name命名是JS里的约定：标识这是一个“私有”属性，避免和存取器的name重名，防止出现无限递归（比如如果setter里写this.name = value，会反复调用自己直到栈溢出）。
• 类的存取器会覆盖同名的直接属性访问逻辑，这是JS类语法的特性，目的是让属性的读写可以被拦截和控制。

内容的提问来源于stack exchange，提问作者vaichidrewar