理解 ES12 的私有属性

在 JavaScript 中，私有属性是指只能在类内部访问的属性。在 ES12 中，我们可以使用 # 符号来定义私有属性。在本文中，我们将详细讨论 ES12 的私有属性，包括其定义、访问和使用。

定义私有属性

在 ES12 中，我们可以使用 # 符号来定义私有属性。下面是一个示例：

class Person {
  #name;

  constructor(name) {
    this.#name = name;
  }

  getName() {
    return this.#name;
  }
}

const person = new Person('张三');
console.log(person.getName()); // 输出：张三
console.log(person.#name); // 报错：SyntaxError: Private field '#name' must be declared in an enclosing class

在上面的示例中，我们使用 #name 定义了一个私有属性。在类的构造函数中，我们可以使用 this.#name 来设置私有属性的值。在类的其他方法中，我们可以使用 this.#name 来获取私有属性的值。注意，我们不能在类外部访问私有属性，否则会抛出语法错误。

访问私有属性

在 ES12 中，我们可以使用 # 符号来访问私有属性。下面是一个示例：

class Person {
  #name;

  constructor(name) {
    this.#name = name;
  }

  getName() {
    return this.#name;
  }
}

const person = new Person('张三');
console.log(person.getName()); // 输出：张三
console.log(person.#name); // 报错：SyntaxError: Private field '#name' must be declared in an enclosing class

在上面的示例中，我们可以通过调用 getName 方法来访问私有属性 #name 的值。但是，我们不能直接访问私有属性 #name，否则会抛出语法错误。

使用私有属性

在 ES12 中，我们可以使用私有属性来保护类的内部状态，以避免意外修改。下面是一个示例：

class BankAccount {
  #balance;

  constructor(balance) {
    this.#balance = balance;
  }

  deposit(amount) {
    this.#balance += amount;
  }

  withdraw(amount) {
    if (this.#balance >= amount) {
      this.#balance -= amount;
      return true;
    } else {
      return false;
    }
  }

  getBalance() {
    return this.#balance;
  }
}

const account = new BankAccount(1000);
console.log(account.getBalance()); // 输出：1000
account.deposit(500);
console.log(account.getBalance()); // 输出：1500
account.withdraw(2000);
console.log(account.getBalance()); // 输出：1500

在上面的示例中，我们使用私有属性 #balance 来存储银行账户的余额。在类的方法中，我们可以使用 this.#balance 来访问私有属性的值。由于私有属性只能在类内部访问，因此外部代码无法直接修改银行账户的余额。

总结

在 ES12 中，我们可以使用 # 符号来定义、访问和使用私有属性。私有属性可以帮助我们保护类的内部状态，以避免意外修改。在使用私有属性时，我们应该注意遵循封装原则，尽量减少对外部代码的暴露。

来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/65c310b7add4f0e0ffd1f44b