为什么 Chrome 不允许在调试中更改变量

Question

我在 Chome devtools 中运行下一个代码

(function() {
  var a = 5;
  debugger; // when I stop here I evaluate `a = 9`
  console.log(a);
})(); // and got 5

但如果我使用

(function() {
  var a = { a: 5 };
  debugger; // when I stop here I evaluate `a.a = 9`
  console.log(a.a);
})(); // and got 9

为什么？

PS 还有为什么它在 FF / Safari 中不起作用（它甚至没有在调试器行中停止）

Answer 1

这是simply a bug 的行为，将在即将发布的版本中修复。

如果您想要更深入地了解“为什么”，您需要了解很多关于 Chrome 的调试器和 JavaScript 实现的知识。根据the diff of one file in the fix，调试器以前使用context_builder.native_context，但现在它使用context_builder.evaluation_context。显然，由旧调试器代码创建的native_context 无法解析（或不视为只读）局部范围变量。如果您真的想要更多，可以联系修复的作者。

至于为什么调试器没有出现在 Firefox 中：如果你从 <script> 运行代码并打开你的开发工具，它就会出现。从控制台运行代码时，您似乎必须专门打开调试器选项卡。显然，如果您打开控制台输入代码，这是不可能的，但您可以将其包装在setTimeout 中并快速切换到调试器选项卡：

setTimeout(function() { debugger; }, 5000)

Answer 2

这是如何使用变量的问题。对象通过引用使用。因此更改a.a 将有效地更改正确内存地址的值。但是，在您的任何测试版本中更改 a 本身不会有任何作用，因为会为控制台中评估的变量创建一个新的内存地址。

对于没有在debugger 行中断的 FireFox，它在此页面 (https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/debugger) 中声明：“如果没有可用的调试功能，则此语句无效。”。所以，我想你必须确保安装了 FireBug。