如何强制Chrome DevTools限制对JavaScript私有成员字段的访问？

这个问题确实挺让人头疼的——毕竟私有字段设计出来就是为了封装和限制访问，DevTools里的特殊“开绿灯”有时候会干扰我们验证代码在真实环境中的行为。下面分享几个实用的方法，帮你让DevTools也乖乖遵守私有字段的访问规则：

• 用隔离的严格模式代码块执行
  别直接在控制台里零散敲代码了，试试DevTools的「代码片段（Snippets）」功能：在Sources面板找到Snippets标签，新建一个代码片段，开头加上'use strict';，然后把完整的类定义和执行代码放进去运行。比如：

  'use strict';
  class ClassWithPrivateField {
    #privateField = 42;
    static #privateStaticField = 43;
  }
  const foo = new ClassWithPrivateField;
  console.log(foo.#privateField, ClassWithPrivateField.#privateStaticField);
  

  这种方式更贴近真实页面的执行环境，会正确触发私有字段的访问错误。

• 检查DevTools的实验性设置
  打开DevTools右上角的齿轮图标进入设置，切换到「Experiments」面板，搜一搜和JavaScript严格模式、私有字段检查相关的选项，看看有没有能启用的实验性功能——有些新版本的DevTools会提供让控制台行为更贴合标准的开关。另外在「Settings > Debugger」里，确认没有误开奇怪的调试豁免选项，同时开启「Pause on caught exceptions」，确保错误能被及时捕获。

• 用页面内代码调试而非直接控制台访问
  如果你是在调试现有页面的代码，别直接在控制台里硬闯私有字段，而是通过Sources面板给代码打个断点，在断点的作用域里查看变量——这时候DevTools会严格遵守私有字段的访问规则，不会让你在作用域外随便读取。或者直接在页面代码里加console.log语句，通过页面自身的执行流程输出结果，这种方式和真实环境完全一致，肯定会触发正确的访问错误。

• 确认执行上下文并尝试版本切换
  看看控制台顶部的上下文选择器（一般显示为「top」或者当前页面的域名），确保选中的是当前页面的执行上下文，而不是浏览器的全局上下文——有时候选错上下文会导致规则失效。如果还是不行，也可以试试Chrome的Beta版或Dev版，这些版本的DevTools对标准的遵守通常更严格，可能已经修复了这个特殊的访问豁免逻辑。

需要说明的是，DevTools允许直接访问私有字段其实是调试场景的妥协——方便开发者在调试时查看内部状态，但如果你需要模拟真实环境的严格性，上面的方法应该能满足你的需求。

内容来源于stack exchange