在定时器回调函数第一行打断点是最直接有效的单步调试方式；也可用事件监听器断点（勾选Timer下的setTimeout/setInterval）或插入debugger语句，配合Scope、Watch面板及F10/F11/Shift+F11快捷键高效调试。
定时任务（如 setTimeout、setInterval）触发时，代码是异步执行的，直接刷新页面或断点打在定时器定义处通常无法捕获执行瞬间。想单步调试其回调函数，关键在于让调试器在回调真正运行时暂停，并能逐行观察逻辑。
在回调函数第一行打普通断点
这是最直接有效的方式。不要在 setTimeout 调用那行打断点，而要定位到它内部执行的函数体开头：
- 打开 Sources 面板 → 找到包含定时器回调的 JS 文件（可能是内联脚本、
<script>块，或外部文件） - 找到回调函数定义的位置，例如：
setTimeout(() => { console.log('done'); }, 1000);→ 在console.log这一行左侧行号处单击，添加断点 - 如果回调是命名函数，比如
setTimeout(handleClick, 500)，就在function handleClick() { ... }的第一行打点
使用事件监听器断点（针对 setInterval 或重复逻辑）
对于周期性执行的任务，可借助 DevTools 的“事件监听器断点”避免反复手动触发：
小红书长文-谷歌浏览器
下载
在 Linux 上通过 Chrome 挂载/VNC 自动发布小红书长笔记。Agent 撰写标题和正文后执行 xhs_publish.sh --publish --submit，触发小红书发布。
- 在 Sources 面板右侧调试区，展开 Event Listener Breakpoints
- 勾选 Timer → 展开后勾选 setTimeout 和/或 setInterval
- 刷新页面或触发定时器注册逻辑，当浏览器内部准备调用回调时，会自动暂停（停在定时器调度点，不是回调里）
- 此时点击 Step into（F11），即可跳入你实际写的回调函数，开始单步
用 debugger 语句强制中断（适合快速验证）
在回调内部首行插入 debugger;，比手动找行打点更快，尤其适合临时调试动态生成的回调：
立即学习“Java免费学习笔记（深入）”；
- 例如：
setTimeout(() => { debugger; console.log('checking value:', data); }, 800); - 确保开发者工具已打开（否则
debugger会被忽略） - 该语句效果等同于在这一行打了断点，执行到此即暂停，可立即查看作用域变量、调用栈
观察与单步的关键操作
断点命中后，别只看代码高亮——善用右侧面板提升效率：
-
Scope 面板：查看
Local下当前回调内的参数和变量；若用了闭包，检查Closure域里的外层变量是否符合预期 -
Watch 面板：添加表达式如
typeof data、data?.length，实时监控状态变化 - 单步控制：
– Step over（F10）：跳过函数调用，不进入其内部
– Step into（F11）：进入回调或你调用的子函数内部
– Step out（Shift+F11）：快速跳出当前回调，回到定时器系统调用位置
