断点暂停后，调试控制台可直接输入当前堆栈帧内可见的变量、属性、函数调用及原生js表达式（如user.name、items.filter(i => i.id > 100)），但不支持let/const声明或副作用操作；输入报referenceerror说明变量不在当前作用域。
断点暂停后，调试控制台能直接输什么
VSCode 调试控制台不是 REPL，但作用域内已定义的变量、函数、对象属性都能直接引用。只要当前堆栈帧里能访问到，就支持求值。
常见错误现象：输入 user.name 报错 ReferenceError: user is not defined——说明 user 不在当前作用域（比如它在上层闭包或异步回调里未被捕获）；输入 array.map(...) 返回空数组，可能是 array 当前为 undefined 或 null，没做防御性检查。
- 支持原生 JS 表达式：
items.filter(i => i.id > 100)、Math.max(...numbers) - 可调用无副作用方法：
JSON.stringify(data)、new Date().toISOString() - 不推荐执行带副作用的操作：
localStorage.setItem('x', 'y')、fetch('/api')，可能污染状态或触发重复请求 - 注意 this 指向：在箭头函数中
this继承外层，普通函数中可能为undefined（严格模式）
监视面板（Watch）和调试控制台的区别在哪
调试控制台是“一次一问”，适合临时探查；监视面板是“持续盯梢”，适合长期关注某几个关键表达式是否异常变化。
使用场景差异明显：比如你在调试一个循环，想确认每次迭代时 item.status 是否始终为 'pending'，与其每次暂停都手动输一遍，不如在监视面板加一项 item.status === 'pending'——它会在每次断点命中时自动刷新布尔结果。
- 监视项支持深层访问：
config?.api?.timeout、response.data?.[0]?.name - 语法错误会显示
NaN或红色报错提示，比控制台更安静，容易被忽略——建议添加后立刻看一眼是否正常渲染 - 监视表达式不支持
let/const声明，也不能写多行语句，仅限单个表达式 - 右键监视项可「移除」或「编辑」，但无法「禁用」——想临时停用得删掉再加回
为什么有些变量在变量面板里能看到，但在控制台输不出来
变量面板展示的是当前堆栈帧的完整作用域快照，包括闭包变量、函数参数、this 上下文；而调试控制台执行表达式时，只按 JS 作用域链查找，某些闭包变量可能因优化被剥离，或未被调试器捕获。
典型例子：React 函数组件内的 useState 返回值（如 [count, setCount]）在变量面板里可见，但直接输 count 可能报错——因为它是闭包内局部绑定，未提升为可访问标识符。
- 优先用鼠标悬停查看简单值，比输名字更快
- 复杂对象建议先在变量面板展开，找到确切路径后再复制粘贴到控制台，比如
props.children.props.id - 遇到
Not available提示，说明该变量被 JS 引擎优化掉了（如未实际使用），可尝试在源码中加一行console.log(x);再断点，强制保留 - TS/JSX 文件中类型信息不影响运行时求值，但类型错误不会阻止表达式执行
配合条件断点，让表达式求值真正高效
单独用控制台是“被动查”，加上条件断点才是“主动抓”。比如你想只在 userId === 123 时中断并检查数据，而不是手动翻几百次循环。
右键断点 →「编辑断点」→ 输入条件表达式，支持完整 JS 语法（但不能有赋值或声明）。VSCode 会在每次到达该行时先计算这个表达式，为真才暂停。
- 条件表达式里可访问当前作用域所有变量，包括
arguments和this - 避免写耗性能的表达式，如
largeArray.some(...)，可能拖慢调试速度 - 条件断点 + 控制台组合技：命中后立刻输
debugger触发浏览器调试器，或console.table(items.slice(0,5))快速格式化输出 - 日志断点（Logpoint）是轻量替代：右键断点 →「编辑断点」→ 填入
用户 {userId} 的余额: {balance}，不中断执行，纯输出
