具有私有/受保护属性的 ES6 类

Question

我有一个如下的 ES6 类

class CoffeeMachine {
  constructor(power) {
    this._power = power;
  }
  get power() {
    return this._power;
  }
}

// create the coffee machine 
let coffeeMachine = new CoffeeMachine(100);

console.log(coffeeMachine);

我有 2 个问题；

1. 对于console.log(coffeeMachine)，我得到以下；

CoffeeMachine {
_power: 100,
__proto__:
power: 100
}

我可以看到“power”在 CoffeeMachine 的 proto 上，并且具有相同的值，即 100 考虑到我没有在任何地方明确设置“电源”，这是怎么发生的？

1. 在这个例子中真的可以实现私有/受保护吗？我知道最新的 ES 中有 #privateVar，但想知道是否可以在这段代码中模拟它？

Answer 1

getter 和 setter 是 transparent，这意味着观察者（控制台）无法区分常规属性和 getter/setter。

考虑到我没有在任何地方明确设置“电源”，这是怎么发生的？

我猜这是控制台评估对象的所有值一次，然后将这些值与拥有这些属性的相应对象相关联。否则，它必须对 getter 进行两次评估（一次用于对象，一次用于原型），并且这种行为可能是不需要的。

您可以手动评估原型上的 getter：

class See { get me() { return "now"; } }

console.log(See.prototype.me);

在这个例子中真的可以实现私有/受保护吗？

是的，在 ES6 中肯定可以在 Map 周围使用 IIFE：

 const Private = (() => {
    const priv = new WeakMap();

    return class {
      get priv() { return priv.get(this); }
      set priv(v) { priv.set(this, v); }
    };
 })();

但是，正如 cmets 中已经指出的那样，您可能不需要它。正如你所说，对于 ES2020，有私有属性。

Answer 2

您需要创建带有# 前缀的私有变量。示例：

class CoffeeMachine {
  #_power;
  constructor(power) {
    this.#_power = power;
  }
  get power() {
    return this.#_power;
  }
}

// create the coffee machine 
let coffeeMachine = new CoffeeMachine(100);

console.log(coffeeMachine);
console.log(coffeeMachine._power);
console.log(coffeeMachine.power);