VSCode JavaScript调试支持条件/命中次数断点、调试时动态改变量、调试控制台执行脚本、异步堆栈跟踪及调试装饰器。1.右键行号设条件（如i===5）或命中次数断点；2.变量面板双击修改值；3.调试控制台可定义函数、调用方法；4.设置debug.javascript.legacyAsyncStacks为false启用异步堆栈；5.装订线图标与黄色箭头标识断点和执行位置。
如果您在使用 VSCode 进行 JavaScript 开发时，发现调试体验远超基础断点和变量查看，则可能尚未启用其内置调试器中未被广泛宣传但高度实用的调试能力。以下是几个鲜为人知却可显著提升调试效率的功能：
本文运行环境：MacBook Air M2，macOS Sequoia。
一、条件断点与命中次数断点
条件断点允许仅在满足特定表达式时暂停执行；命中次数断点则可在某行代码被执行指定次数后才触发，适用于循环体内部的精准定位。
1、在代码行号左侧灰色区域单击右键，选择“添加条件断点”。
立即学习“Java免费学习笔记（深入）”；
2、在弹出输入框中输入 JavaScript 表达式，例如 i === 5 或 response?.status !== 200。
3、如需设置命中次数，右键同一位置选择“添加命中次数断点”，输入整数，例如 3 表示第 3 次执行该行时中断。
二、调试时动态修改变量值
在调试会话暂停状态下，可直接在“变量”面板中双击任意变量值并输入新内容，VSCode 会实时注入并更新运行时上下文，无需重启调试会话。
1、启动调试并暂停于断点处。
2、在左侧“变量”面板中找到目标变量，例如 count。
3、双击其当前值（如 0），输入新值（如 999），按 Enter 确认。
4、继续执行后，该变量将携带新值参与后续逻辑运算。
三、调试控制台中执行任意脚本片段
调试控制台不仅支持求值表达式，还可定义函数、模拟事件、调用未导出模块方法，甚至 patch 当前作用域中的闭包变量。
1、在调试暂停状态下，聚焦于底部“调试控制台”面板。
2、输入完整函数定义，例如：function testHelper() { return 'patched'; }
3、立即调用该函数：testHelper()，输出结果即时返回。
4、若需覆盖已有变量，直接赋值即可，如：user.name = 'admin'。
四、调试时启用“异步堆栈跟踪”视图
默认情况下，Chrome 调试器仅显示同步调用链；启用异步堆栈后，VSCode 可还原 Promise 链、setTimeout 回调、事件监听器等跨异步任务的完整调用路径。
1、打开 VSCode 设置（Cmd+,）。
2、搜索 debug.javascript.legacyAsyncStacks。
3、将其值设为 false（即启用现代异步堆栈）。
4、重启调试会话，在“调用堆栈”面板顶部切换至 Async 标签页查看全链路。
五、使用“调试装饰器”高亮活动断点与执行位置
VSCode 会在编辑器右侧装订线（gutter）中以彩色图标直观标识断点状态，并在当前执行行右侧边缘绘制黄色箭头装饰器，即使代码折叠或滚动后仍可快速定位。
1、确保已启用 debug.showInStatusBar 设置项（默认开启）。
2、启动调试后，观察编辑器右侧装订线：红色实心圆为启用断点，红色空心圆为禁用断点，蓝色菱形为日志点。
3、当执行流到达某行时，右侧边缘会出现 黄色向右箭头，且该行背景轻微高亮。
4、若同时存在多个调试会话，不同会话的执行指示器将以不同颜色区分，例如 青色 和 洋红。
