Chrome 的开发工具或 Firebug 中是不是存在“设置下一条语句”功能？

Posted 2023-03-07

【中文标题】Chrome 的开发工具或 Firebug 中是不是存在“设置下一条语句”功能？

【英文标题】：Does the "Set next statement" feature exist in Chrome's Dev Tools or in Firebug?Chrome 的开发工具或 Firebug 中是否存在“设置下一条语句”功能？

【发布时间】：2012-05-06 06:53:33

【问题描述】：

IE 的开发工具，更具体地说是它的 javascript 调试器，提供了“设置下一条语句”命令，使您能够指定接下来应该执行哪条语句。这样，您可以有效地跳过函数的某些部分，甚至（再次有效地）提前从函数返回。

所以，对于这个函数...

function test () 
    alert(1);
    alert(2);
    alert(3);

如果我们在第一个警报上设置断点，然后调用该函数，我们可以执行第一个警报（F10），然后右键单击第三个警报并选择“设置下一条语句”。现在，如果我们按 F10，将执行第三个警报，因此实际上跳过了第二个警报。

（在IE中测试here：---用F12打开IE的工具，切换到“脚本”选项卡，设置断点，按“开始调试”按钮，必要时刷新页面）

我喜欢这个“设置下一条语句”功能。但是，我在 Chrome 的开发工具或 Firebug 中没有注意到它。这些调试器中是否存在此功能？

【问题讨论】：

感谢您指出 IE 有“设置下一条语句”我不知道所以我从 Chrome 切换到 IE 以执行一项调试任务

【参考方案1】：

虽然 Chrome DevTools 没有“设置下一条语句”，但您可以通过在断点处暂停时编辑 JavaScript 来更明确地定义下一条语句。

我为您制作了一个简短的screencast 来展示 Chrome DevTools Live Edit + Breakpoint Debugging。

本质上：在断点处，通过单击“脚本”面板并进行更改来实时编辑您的脚本。点击 cmd + s 保存。然后遍历该代码及其新更改。比绕过代码更强大，您还可以添加新功能。

【讨论】：

感谢截屏视频 :) 是的，我知道 Chrome 的内联代码编辑（我看过你去年所做的演讲，介绍了它）。这是一个杀手级功能，可用于各种事情——例如，早早退出一个函数，正如我在my other question here 中提到的那样。但是，我希望最终在 Chrome 中看到“设置下一条语句”。 （Ctrl+S 将重新运行该函数，我可能会发现自己正处于一个函数中间，我不想想再次重新运行整个函数，但仍想跳过一个或更多语句。）

Paul，有没有想过要从一个非常好的调试器中添加这个明显的遗漏？主要用途是重新运行具有不同数据的代码块并进入未按预期工作的块。更改代码是在 调试之后完成的。到达断点可能需要几分钟的工作，并且必须重复这些步骤才能返回该断点会浪费大量时间。 Microsoft 调试器自 QuickBasic 以来就具有此功能。在 Visual Studio 调试器系列中，至少从 VB5（17 年前）开始，“设置下一条语句”就已经启用了拖放功能。

@PaulIrish 今天仍然是最好的解决方案吗？我看到很多用例：当你想跳过一些代码行时，当你想重新运行最后一行 n 时，当你想陷入 else 语句时当您动态更改对象的属性并希望使用新值重新运行最后一行时，代码应该进入 if 的位置，等等...代码编辑非常酷，但对于这个“GOTO”功能来说似乎有点过头了，而且不像将“下一条指令光标”拖放到新位置那么快。此外，这将补充“重新启动框架”很棒的功能:)

@PaulIrish 一个主要用例是当您运行一行代码并且需要再次检查它而不重新运行整个执行时。我一直在 Visual Studio 中使用此功能来帮助查明错误发生的位置。

是的。我同意这应该存在。如果我们在脚本中设置多个debugger 语句，那么在解析器传递每个后续语句时能够在每个语句上暂停会很有帮助。由于它现在存在，它只会在第一个 debugger 语句处暂停，如果我恢复执行，它将跳过所有后续调试器。