VSCode 调试控制台是可交互的运行时环境,支持执行表达式、查看修改变量、调用函数及利用 $ 引用上一次结果;需在调试会话中启用,快捷键 Ctrl+Shift+Y(Win/Linux)或 Cmd+Shift+Y(macOS)打开。
vscode 的调试控制台(debug console)不只是看输出的地方,它其实是个可交互的运行时环境,能直接执行代码、检查变量、调用函数,甚至修改状态——关键在于你得知道怎么“唤醒”它的真正能力。
启用并打开调试控制台
调试控制台默认在启动调试会话后自动出现,但有时被隐藏或未聚焦。确保它可见:点击菜单 View → Debug Console,或按快捷键 Ctrl+Shift+Y(Windows/Linux)/ Cmd+Shift+Y(macOS)。注意:它只在调试会话活跃时可用,没进断点或没启动调试,这里就是灰的。
在控制台里直接执行表达式
和浏览器开发者工具的 Console 类似,你敲一行 JS/TS/Python 等支持语言的表达式(取决于调试器),回车就立刻求值。比如:
- JavaScript/TypeScript 调试中 :输入
user.name查看当前作用域下 user 对象的 name 属性; - 输入
debugger可手动触发断点(需已启用“停用断点”功能); - 输入
console.log('test')会把输出显示在 Debug Console,也同步到终端的 Debug 输出通道。
访问和修改当前作用域变量
停在断点时,Debug Console 默认使用当前堆栈帧的作用域。你可以读取局部变量、闭包变量、this 上的属性。更进一步:
- 输入
this.state(React 组件调试时)查看组件当前状态; - 输入
arr.push(99)直接修改数组——下次继续执行时,这个变更生效; - 对对象属性赋值,如
config.timeout = 5000,可临时调整行为,快速验证逻辑。
⚠️ 注意:不是所有运行时都支持写操作(如某些只读上下文或优化后的变量),但绝大多数 Node.js 和现代浏览器调试器都支持。
利用 $ 引用上一次结果
Debug Console 支持类似 Chrome Console 的隐式变量 $,它保存最近一次表达式执行的结果。例如:
- 先输入
[1,2,3].filter(x => x > 1)→ 返回[2, 3]; - 再输入
$.length→ 得到2; - 还可链式用
$[0]拿第一个元素。
这个小技巧省去重复输入或临时变量声明,调试探查时特别顺手。
基本上就这些——不复杂但容易忽略。多试几次表达式求值和变量修改,Debug Console 就从“日志显示器”变成你调试时最趁手的实时沙盒。