step over（f8）跳过函数体整体执行，停在下一行；step into（f7）进入当前行函数首行调试，但默认不进嵌套调用，需shift+f7选子调用或alt+shift+f7强制步入。
WebStorm里Step Over（F8）和Step Into（F7）到底怎么选
关键看你想不想进函数体内部。如果当前行调用了一个函数，F8会把它当“黑盒”整体执行完，停在下一行；F7则会跳进这个函数第一行，继续逐行调试。但注意：F7默认只进最外层调用，不会自动钻进该函数内部再调用的其他函数——那是Alt + Shift + F7干的事。
常见误操作：看到一行有多个函数调用（比如 foo(bar(), baz())），直接按F7，结果卡在bar()里出不来。这时候应该用Shift + F7，它会弹出菜单让你选进哪个子调用。
- 适合用
F8的场景：确认函数外部行为正常，或函数体太长不想逐行跟 - 适合用
F7的场景：要验证某个函数的输入/输出、内部逻辑分支是否符合预期 - 别用
F7硬刚嵌套调用链——优先Shift + F7或设断点在目标函数开头
Step Out（Shift + F8）不是“跳出循环”，而是“返回上一层调用”
Shift + F8的作用是立刻结束当前函数剩余代码的执行，直接跳回它的调用者处，并停在调用语句的下一行。它和F9（恢复运行到下一个断点）效果常被混淆，但本质不同：F9是继续跑，Shift + F8是“逃出当前函数作用域”。
典型用例：你误进了某个工具函数（比如 lodash.map），发现没必要深究，按Shift + F8就能秒回你自己的业务代码里。但如果当前函数已经执行到末尾，Shift + F8就等价于F9——因为本来就要返回了。
- 它不关心循环或条件块，只认函数边界
- 如果函数里有
return提前退出，Shift + F8仍会触发返回动作，但不会重新执行return之后的代码 - 在异步回调里慎用——可能跳回的位置不是你预期的同步调用栈位置
为什么按了F7没反应？常见断点与快捷键失效原因
最常被忽略的是：F7、F8这些快捷键只在Debugger已激活且程序处于暂停状态时才有效。如果控制台显示“Disconnected”或浏览器 DevTools 报 Paused before potential out-of-bounds access 这类错误，WebStorm 的调试器其实已经失联，按键自然无效。
另一个高频坑：你在 TypeScript 文件里打了断点，但实际运行的是编译后的 .js，而 sourcemap 没配好或没加载成功。此时断点虽亮着，但执行根本不会停——F7按了也像没按。
- 检查右下角状态栏是否有
Debug标识，且旁边显示Connected - 确认 Chrome / Edge 已启用
Allow remote debugging，且 WebStorm 的JavaScript Debug配置里 URL 匹配实际访问地址 - 在
Settings > Languages & Frameworks > JavaScript > Debugging中确认Enable source maps已勾选，且.map文件路径正确
Ctrl + Shift + F8 设置条件断点，比反复按F9更省时间
当你只想在特定数据状态下暂停（比如 user.id === 123 时才进调试），硬是靠F9一路放行再手动加断点效率极低。Ctrl + Shift + F8能直接给当前断点绑定表达式，满足条件才触发。
注意语法：条件里写的变量必须在当前作用域可见。比如在 for (let i = 0; i 循环内设断点，条件写 <code>i === 5 没问题；但写 list[5].name 就可能报 ReferenceError——因为 list 可能还没初始化，或作用域未覆盖到。
- 条件表达式支持完整 JS 语法，包括三元、逻辑运算，但避免调用副作用函数（如
console.log()） - 条件断点在断点面板（
View > Tool Windows > Breakpoints）里可集中管理、开关、编辑 - 如果条件太复杂或涉及异步状态，不如直接在代码里插
debugger语句，更可控
F7就变成无意义的按键。
