0

0

JavaScript如何实现真正的私有类字段?

紅蓮之龍

紅蓮之龍

发布时间:2025-09-27 11:24:01

|

334人浏览过

|

来源于php中文网

原创

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

javascript如何实现真正的私有类字段?

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';。这显然不是真正的私有,因为它没有语言层面的强制约束。

立即学习Java免费学习笔记(深入)”;

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

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来移除它。这保证了类实例状态的稳定性,防止了不必要的副作用。

Sheet+
Sheet+

Excel和GoogleSheets表格AI处理工具

下载

还有一点,私有字段是实例独有的。每个类实例都有自己的一套私有字段。它们不是原型链上的属性,也不会被继承到子类。如果子类需要自己的私有字段,它必须独立声明。这意味着,父类的私有字段对子类来说是完全不可见的,即使子类的方法也无法直接访问父类的私有字段。这和公共属性或受保护属性(如果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)。通过importexport语法,我们可以明确地定义一个模块的公共接口,而模块内部的所有未导出的变量、函数或类,都自然地成为了“私有”的。这是一种文件级别的封装,也是现代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

internalHelpermyModule.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开发者在构建复杂、可维护的应用时,拥有了更多的选择和更强的控制力。

热门AI工具

更多
DeepSeek
DeepSeek

幻方量化公司旗下的开源大模型平台

豆包大模型
豆包大模型

字节跳动自主研发的一系列大型语言模型

通义千问
通义千问

阿里巴巴推出的全能AI助手

腾讯元宝
腾讯元宝

腾讯混元平台推出的AI助手

文心一言
文心一言

文心一言是百度开发的AI聊天机器人,通过对话可以生成各种形式的内容。

讯飞写作
讯飞写作

基于讯飞星火大模型的AI写作工具,可以快速生成新闻稿件、品宣文案、工作总结、心得体会等各种文文稿

即梦AI
即梦AI

一站式AI创作平台,免费AI图片和视频生成。

ChatGPT
ChatGPT

最最强大的AI聊天机器人程序,ChatGPT不单是聊天机器人,还能进行撰写邮件、视频脚本、文案、翻译、代码等任务。

相关专题

更多
js获取数组长度的方法
js获取数组长度的方法

在js中,可以利用array对象的length属性来获取数组长度,该属性可设置或返回数组中元素的数目,只需要使用“array.length”语句即可返回表示数组对象的元素个数的数值,也就是长度值。php中文网还提供JavaScript数组的相关下载、相关课程等内容,供大家免费下载使用。

559

2023.06.20

js刷新当前页面
js刷新当前页面

js刷新当前页面的方法:1、reload方法,该方法强迫浏览器刷新当前页面,语法为“location.reload([bForceGet]) ”;2、replace方法,该方法通过指定URL替换当前缓存在历史里(客户端)的项目,因此当使用replace方法之后,不能通过“前进”和“后退”来访问已经被替换的URL,语法为“location.replace(URL) ”。php中文网为大家带来了js刷新当前页面的相关知识、以及相关文章等内容

437

2023.07.04

js四舍五入
js四舍五入

js四舍五入的方法:1、tofixed方法,可把 Number 四舍五入为指定小数位数的数字;2、round() 方法,可把一个数字舍入为最接近的整数。php中文网为大家带来了js四舍五入的相关知识、以及相关文章等内容

776

2023.07.04

js删除节点的方法
js删除节点的方法

js删除节点的方法有:1、removeChild()方法,用于从父节点中移除指定的子节点,它需要两个参数,第一个参数是要删除的子节点,第二个参数是父节点;2、parentNode.removeChild()方法,可以直接通过父节点调用来删除子节点;3、remove()方法,可以直接删除节点,而无需指定父节点;4、innerHTML属性,用于删除节点的内容。

479

2023.09.01

JavaScript转义字符
JavaScript转义字符

JavaScript中的转义字符是反斜杠和引号,可以在字符串中表示特殊字符或改变字符的含义。本专题为大家提供转义字符相关的文章、下载、课程内容,供大家免费下载体验。

554

2023.09.04

js生成随机数的方法
js生成随机数的方法

js生成随机数的方法有:1、使用random函数生成0-1之间的随机数;2、使用random函数和特定范围来生成随机整数;3、使用random函数和round函数生成0-99之间的随机整数;4、使用random函数和其他函数生成更复杂的随机数;5、使用random函数和其他函数生成范围内的随机小数;6、使用random函数和其他函数生成范围内的随机整数或小数。

1091

2023.09.04

如何启用JavaScript
如何启用JavaScript

JavaScript启用方法有内联脚本、内部脚本、外部脚本和异步加载。详细介绍:1、内联脚本是将JavaScript代码直接嵌入到HTML标签中;2、内部脚本是将JavaScript代码放置在HTML文件的`<script>`标签中;3、外部脚本是将JavaScript代码放置在一个独立的文件;4、外部脚本是将JavaScript代码放置在一个独立的文件。

659

2023.09.12

Js中Symbol类详解
Js中Symbol类详解

javascript中的Symbol数据类型是一种基本数据类型,用于表示独一无二的值。Symbol的特点:1、独一无二,每个Symbol值都是唯一的,不会与其他任何值相等;2、不可变性,Symbol值一旦创建,就不能修改或者重新赋值;3、隐藏性,Symbol值不会被隐式转换为其他类型;4、无法枚举,Symbol值作为对象的属性名时,默认是不可枚举的。

554

2023.09.20

苹果官方查询网站 苹果手机正品激活查询入口
苹果官方查询网站 苹果手机正品激活查询入口

苹果官方查询网站主要通过 checkcoverage.apple.com/cn/zh/ 进行,可用于查询序列号(SN)对应的保修状态、激活日期及技术支持服务。此外,查找丢失设备请使用 iCloud.com/find,购买信息与物流可访问 Apple (中国大陆) 订单状态页面。

0

2026.01.26

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
React 教程
React 教程

共58课时 | 4.1万人学习

TypeScript 教程
TypeScript 教程

共19课时 | 2.5万人学习

Bootstrap 5教程
Bootstrap 5教程

共46课时 | 3万人学习

关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号