JavaScript私有字段实现技巧

还在为JavaScript私有类字段的实现而困扰吗？本文将深入探讨JavaScript中实现真正私有类字段的方法。官方推荐使用ES2022引入的#前缀语法，它提供了语言层面的强封装性，确保字段在类外部无法访问，从根本上区别于传统的下划线约定。对于旧环境，WeakMap虽可作为变通方案，但其私有性不如#彻底，且增加代码复杂度。文章还将剖析#私有字段的使用细节与限制，以及ES Modules、闭包、Symbol等其他提升封装性的机制，助你构建更安全、可维护的JavaScript代码。掌握这些技巧，提升你的JavaScript开发技能，打造高质量应用！

JavaScript实现真正私有类字段的官方推荐方式是使用#前缀语法，如#balance在类外部无法访问，确保了语言层面的强封装性，而WeakMap等旧方案因需外部存储且不够直观而受限。

JavaScript实现真正私有类字段，最直接且官方推荐的方式是使用ES2022引入的#前缀语法。这种语法在语言层面提供了封装，确保了字段在类外部的不可访问性。对于不支持此语法的旧环境，WeakMap提供了一种变通方案，但其私有性不如#彻底，且使用上会增加一些样板代码。

解决方案

要实现真正的私有类字段，我们现在可以直接使用#（hash）前缀来定义它们。这是语言内置的机制，提供了强封装性。

class BankAccount {
  #balance; // 私有字段

  constructor(initialBalance) {
    if (initialBalance < 0) {
      throw new Error("Initial balance cannot be negative.");
    }
    this.#balance = initialBalance;
  }

  deposit(amount) {
    if (amount <= 0) {
      throw new Error("Deposit amount must be positive.");
    }
    this.#balance += amount;
    console.log(`Deposited ${amount}. New balance: ${this.#balance}`);
  }

  withdraw(amount) {
    if (amount <= 0) {
      throw new Error("Withdrawal amount must be positive.");
    }
    if (this.#balance < amount) {
      throw new Error("Insufficient funds.");
    }
    this.#balance -= amount;
    console.log(`Withdrew ${amount}. New balance: ${this.#balance}`);
    return amount;
  }

  getAccountInfo() {
    // 可以在类内部访问私有字段
    return `Current balance: ${this.#balance}`;
  }
}

const myAccount = new BankAccount(1000);
myAccount.deposit(500); // Deposited 500. New balance: 1500
myAccount.withdraw(200); // Withdrew 200. New balance: 1300

// 尝试从外部访问私有字段会导致语法错误或运行时错误
// console.log(myAccount.#balance); // SyntaxError: Private field '#balance' must be declared in an enclosing class
// console.log(myAccount['#balance']); // undefined

如你所见，#balance字段在BankAccount类外部是完全不可访问的。任何试图从外部访问它的尝试都会导致JavaScript引擎抛出错误，这和那些仅仅是“约定俗成”的私有（比如下划线前缀）有着本质的区别。这种语法级别的强制性，才是我个人觉得“真正”私有的体现。

为什么传统的下划线（_）或闭包无法实现“真正”的私有？

说实话，在#私有字段出现之前，JavaScript社区为了模拟私有性，真是绞尽脑汁。最常见的就是用下划线_作为前缀，比如_balance。这东西，在我看来，与其说是私有，不如说是“君子协定”。它仅仅是告诉开发者：“嘿，这个属性是内部用的，你最好别直接动它。”但实际上，你完全可以从外部轻松访问甚至修改它：myObject._privateField = 'new value';。这显然不是真正的私有，因为它没有语言层面的强制约束。

然后是闭包，这确实能提供更强的私有性，尤其是在早期。通过将私有变量或函数封装在一个函数作用域内，并只暴露公共接口，外部确实无法直接访问这些私有成员。

function createCounter() {
  let count = 0; // 私有变量

  return {
    increment: function() {
      count++;
      return count;
    },
    decrement: function() {
      count--;
      return count;
    },
    getCount: function() {
      return count;
    }
  };
}

const counter = createCounter();
console.log(counter.getCount()); // 0
counter.increment();
console.log(counter.getCount()); // 1
// console.log(counter.count); // undefined，无法直接访问

这种模式对于函数构造器或者模块模式非常有效。但当涉及到类（class）时，如果每个实例都有很多私有字段，用闭包来管理会变得相当笨重。你可能需要为每个私有字段维护一个WeakMap，或者在构造函数里创建大量的闭包作用域来保存状态，这无疑增加了代码的复杂度和样板代码量。例如，使用WeakMap模拟私有字段：

const _balances = new WeakMap();

class OldBankAccount {
  constructor(initialBalance) {
    _balances.set(this, initialBalance); // 将私有数据存储在WeakMap中
  }

  deposit(amount) {
    let currentBalance = _balances.get(this);
    currentBalance += amount;
    _balances.set(this, currentBalance);
    console.log(`Deposited ${amount}. New balance: ${currentBalance}`);
  }

  getBalance() {
    return _balances.get(this);
  }
}

const oldAccount = new OldBankAccount(500);
oldAccount.deposit(100);
console.log(oldAccount.getBalance()); // 600
// console.log(oldAccount._balances); // undefined
// _balances.get(oldAccount) // 如果_balances不在当前作用域，也无法访问

WeakMap方案确实能提供类似#的私有性，因为外部无法直接访问_balances这个WeakMap实例，也无法通过实例对象oldAccount来获取私有数据。但它需要一个外部的WeakMap来存储私有数据，这使得私有字段的定义和使用分散在类内部和外部，不如#语法那样直观地将私有性“嵌入”到类定义本身。在我看来，#语法是语言层面对私有性缺失的直接且优雅的回应，它让私有字段成为类定义不可分割的一部分，而不是一个外部的约定或数据结构。

# 私有字段在使用时有哪些细节和限制？

#私有字段虽然强大，但在实际使用中也有一些需要注意的细节和限制，这些东西搞清楚了，能避免不少坑。

首先，它们确实是不可访问的。这意味着你不能像访问普通属性那样，通过obj.#field在类外部进行读取或赋值。尝试这样做会导致SyntaxError。这和那些仅仅是“内部约定”的私有属性有着天壤之别。

其次，私有字段不能被枚举。当你使用Object.keys()、for...in循环或者JSON.stringify()时，私有字段是不会出现的。这进一步强化了它们的封装性，因为它们不应该作为类的公共接口的一部分暴露出去。

再者，它们不能被删除。一旦定义了私有字段，你就不能通过delete this.#field来移除它。这保证了类实例状态的稳定性，防止了不必要的副作用。

还有一点，私有字段是实例独有的。每个类实例都有自己的一套私有字段。它们不是原型链上的属性，也不会被继承到子类。如果子类需要自己的私有字段，它必须独立声明。这意味着，父类的私有字段对子类来说是完全不可见的，即使子类的方法也无法直接访问父类的私有字段。这和公共属性或受保护属性（如果JavaScript有的话）的继承行为是不同的，在我看来，这是私有性最纯粹的体现——只对定义它的类可见。

class Parent {
  #privateParentField = 'parent secret';
  getPrivateParentField() {
    return this.#privateParentField;
  }
}

class Child extends Parent {
  #privateChildField = 'child secret';
  getChildAndParentPrivateFields() {
    // return this.#privateParentField; // SyntaxError: Private field '#privateParentField' must be declared in an enclosing class
    return this.#privateChildField + ' and ' + this.getPrivateParentField();
  }
}

const childInstance = new Child();
console.log(childInstance.getChildAndParentPrivateFields()); // child secret and parent secret
// console.log(childInstance.#privateChildField); // SyntaxError

从上面的例子可以看出，子类不能直接访问父类的私有字段，但可以通过父类提供的公共方法间接获取。这符合面向对象设计中封装的原则。

最后，私有字段的命名必须以#开头，并且不能与任何公共字段或方法同名（当然，因为是私有，外部也无法知道有没有同名）。这确保了语法的清晰性和一致性。

除了私有字段，JavaScript还有哪些提升封装性的机制？

除了#私有字段，JavaScript在不断演进中提供了多种机制来帮助开发者提升代码的封装性，管理复杂性，并避免不必要的外部依赖和修改。在我看来，这些工具共同构成了JavaScript强大的模块化和面向对象能力。

一个非常核心的机制就是ES Modules（ESM）。通过import和export语法，我们可以明确地定义一个模块的公共接口，而模块内部的所有未导出的变量、函数或类，都自然地成为了“私有”的。这是一种文件级别的封装，也是现代JavaScript应用开发的基础。

// myModule.js
const internalHelper = () => "This is an internal helper."; // 私有于模块
export const publicFunction = () => {
  return "Public function using " + internalHelper();
};

// main.js
import { publicFunction } from './myModule.js';
console.log(publicFunction()); // Public function using This is an internal helper.
// console.log(internalHelper()); // ReferenceError: internalHelper is not defined

internalHelper在myModule.js外部是完全不可见的，它有效地封装了模块内部的实现细节。这种模式对于构建大型应用，管理不同组件之间的依赖关系至关重要。

另外，闭包依然是一个非常有用的封装工具，即便在类和模块盛行的今天。它不仅仅能模拟私有字段，更重要的是，它能创建“私有”的函数或状态，这些状态可以在多个函数之间共享，而外部无法直接访问。这在实现一些高阶函数、工厂函数或者需要维护内部状态的工具函数时非常灵活。

Symbol 也可以在一定程度上提供“伪私有”属性。Symbol是一种原始数据类型，它的值是唯一的。你可以用Symbol作为对象的属性名，这样创建的属性就不是普通的字符串键，不容易被意外地访问或枚举。

const mySecretKey = Symbol('secretKey');

class DataHolder {
  constructor(data) {
    this[mySecretKey] = data;
  }

  getSecretData() {
    return this[mySecretKey];
  }
}

const holder = new DataHolder('sensitive info');
console.log(holder.getSecretData()); // sensitive info
console.log(Object.keys(holder)); // []
console.log(Object.getOwnPropertyNames(holder)); // []
console.log(holder[mySecretKey]); // sensitive info，但需要知道这个Symbol

虽然Symbol属性可以通过Object.getOwnPropertySymbols()获取到，并且如果你知道Symbol本身，依然可以访问到属性，但它至少避免了与普通字符串属性名冲突的风险，也增加了无意中访问的难度。它提供了一种比下划线更强的“约定”，但又不如#私有字段那样强制。

在我看来，这些机制并非相互排斥，而是可以协同工作的。比如，你可以在一个ES Module中定义一个包含#私有字段的类，从而实现多层次的封装：模块级别的私有性，以及类实例级别的私有性。这种组合使用，让JavaScript开发者在构建复杂、可维护的应用时，拥有了更多的选择和更强的控制力。

到这里，我们也就讲完了《JavaScript私有字段实现技巧》的内容了。个人认为，基础知识的学习和巩固，是为了更好的将其运用到项目中，欢迎关注golang学习网公众号，带你了解更多关于的知识点！