逐步执行程序
步进是控制程序逐步执行的过程。
WebStorm 提供了一组步进操作,根据您的策略使用这些操作(例如,您是否需要直接进入下一行或输入您在该处调用的方法)。
步进按钮位于调试窗口工具栏上。
![调试工具窗口:工具栏上的步进按钮 调试工具窗口:工具栏上的步进按钮](https://resources.jetbrains.com/help/img/idea/2021.3/ws_debug_examining_stepping_buttons.png)
跨过去
跳过当前代码行并带您到下一行,即使突出显示的行中有方法调用。方法的实现被跳过,直接进入调用者方法的下一行。
单击“跳过”按钮
或按F8。
在示例中,第 11 行即将执行。如果您越过,调试器将直接移动到第 12 行,而不跳入该multiplication()
方法。
![跨过去](https://resources.jetbrains.com/help/img/idea/2021.3/ws_debug_step_over_example_1.png)
如果跳过的方法中有断点,调试器将在它们处停止。
![Step over:在被跳过的方法中的断点处停止](https://resources.jetbrains.com/help/img/idea/2021.3/ws_debug_step_over_example_2.png)
要在途中跳过任何断点,请使用Force step over Alt+Shift+F8。
![Step over:使用 Force step over 忽略被调用方法中的断点](https://resources.jetbrains.com/help/img/idea/2021.3/ws_debug_step_over_force_step_over.png)
踏进
进入被调用函数的代码。
单击Step into按钮
或按F7。
在示例中,第 11 行即将执行。如果您进入,调试器将跳转到该multiplication()
方法的实现,允许您详细检查其结果是如何产生的。
![进入一个被调用的方法](https://resources.jetbrains.com/help/img/idea/2021.3/ws_debug_step_into.png)
如果在线上有多个方法调用,WebStorm 会询问您输入哪个方法。此功能称为智能步入。
![多方法调用上线:自动智能单步进入](https://resources.jetbrains.com/help/img/idea/2021.3/ws_debug_step_into_smart.png)
默认情况下,每次您F7在具有多个方法调用的行上调用 Step into 时,都会自动使用 Smart step into。您可以使用Step into和Step out按钮关闭自动 Smart step into 并按照调用顺序输入每个调用的方法。
![Automatic Smart step into off:使用 Step into 和 Step out 按照调用的顺序输入被调用的方法](https://resources.jetbrains.com/help/img/idea/2021.3/ws_debug_step_into_smart_off.png)
某些脚本会被Step into跳过,因为您通常可能不需要调试它们。
禁止进入脚本
智能步入
当一行中有多个方法调用,并且您想明确输入哪个方法时,智能单步进入很有帮助。此功能允许您选择您感兴趣的方法调用。
![智能步入:手动调用](https://resources.jetbrains.com/help/img/idea/2021.3/ws_debug_smart_step_into_manual.png)
默认情况下,每次您在具有多个方法调用的行上调用Step into时,都会自动使用 Smart step into。
要禁止自动智能步入,请打开设置/首选项对话框 ( Ctrl+Alt+S),转到 ,并清除Always do smart step into复选框。
之后,调试工具窗口
的工具栏上会出现。仅当调试器停止在具有多个调用的行时,该图标才可用。
要手动调用 Smart step into,请单击Debug工具窗口
工具栏上的,或按,或选择 从主菜单 Shift+F7
走出去
跳出当前方法并带您到它的调用。
单击“退出”按钮
或按Shift+F8。
在示例中,跳出会跳过循环的所有迭代,并直接将您带到它的调用处。
![从一个方法跳出到它的调用者](https://resources.jetbrains.com/help/img/idea/2021.3/ws_debug_step_out.png)
运行到光标
继续执行,直到到达插入符号的位置。
将插入符号放在您希望程序暂停的行并单击
或按Alt+F9。
单击装订线中的行号。
默认情况下,单击行号时运行到光标处于活动状态。要关闭它,请打开Settings/Preferences对话框 ( Ctrl+Alt+S),转到 ,并清除Click line number to perform run to cursor复选框。
在示例中,Run to cursor 将继续执行并在第 23 行停止,就好像有断点一样。
![运行到光标处:点击行号](https://resources.jetbrains.com/help/img/idea/2021.3/ws_debug_run_to_cursor_line_number.png)
如果方法中有断点print_chart()
,程序将在那里暂停。
![运行到光标处:调试器停在被跳过代码的断点处](https://resources.jetbrains.com/help/img/idea/2021.3/ws_debug_run_to_cursor_line_number_breakpoint_in_skipped_code.png)
要在途中跳过任何断点,请使用Force run to cursor。
强行进入
方法中的步骤,即使此方法被常规Step Into跳过。
单击强制进入按钮
或按Alt+Shift+F7。
在示例中,调试器console.log()
在第 4 行使用常规 Step into 跳过库方法,但在第 10 行使用Force step into进入此方法。
![强制步入覆盖忽略的脚本列表](https://resources.jetbrains.com/help/img/idea/2021.3/ws_debug_force_step_into.png)
强制运行到光标
继续执行,直到到达插入符号的位置。途中的所有断点都将被忽略。
将插入符号放在您希望程序暂停的行。
从主菜单中,选择
或按Ctrl+Alt+F9。
在示例中,Force run to cursor将继续执行并在第 24 行停止,就像有一个断点一样。里面的断点print_chart()
不会有任何影响。
![插入符号在我们想去的那一行](https://resources.jetbrains.com/help/img/idea/2021.3/ws_debug_force_run_to_cursor.png)
强行跨过
通过调用设置断点的方法跨过一行。断点被忽略。
从主菜单中,选择
或按Alt+Shift+F8。
在示例中,即使print_chart()
方法中有断点,强制单步执行也会将您带到第 24 行的打印语句,否则,使用单步执行会在循环的所有迭代中暂停应用程序。
![Force Step Over:忽略方法调用处的断点](https://resources.jetbrains.com/help/img/idea/2021.3/ws_debug_force_step_over.png)
重启帧
允许您撤消最后一帧并恢复堆栈中的前一帧。在调试 JavaScript 和 Node.js 时,如果您错过了希望再次查看的关键点,这有助于重新输入函数。
单击重新启动帧按钮
。
要恢复丢失的帧,请单击
或按F9。
当您恢复程序时,WebStorm 将局部变量恢复为执行重新启动的帧之前的值。请注意,不会恢复静态变量和实例变量的值,这可能会改变整个程序流程。
在该示例中,重新启动框架会使您返回到count()
好像count ()
从未执行过的调用。但是,当您恢复程序时,局部变量的初始值result
和i
恢复。
![重新启动框架并恢复程序:变量恢复为初始值](https://resources.jetbrains.com/help/img/idea/2021.3/ws_debug_drop_frame.png)