监视面板不自动随调用堆栈切换更新，需手动刷新；表达式始终在当前选中帧作用域实时求值，切换帧后若变量未定义则报错，非Bug而是为避免副作用。
监视面板本身不自动随调用堆栈切换而更新，但你可以手动让它们协同工作——关键在于“切换堆栈帧”后，监视表达式会基于新帧的作用域重新求值。
为什么监视值在切换调用堆栈后可能变 Error 或 not available
监视表达式始终在当前选中的堆栈帧上下文中执行。当你点击调用堆栈里的某一层（比如一个异步回调帧），Variables 面板会立刻刷新为该帧的局部变量，但监视列表仍显示旧帧的求值结果，直到下一次暂停或你手动触发刷新。
- 常见错误现象：
Error: Cannot read property 'name' of undefined—— 因为当前帧里user未定义，但表达式user.name还在监视列表里 - 不是 Bug，是设计：VS Code 不会在你点击堆栈帧时自动重算监视项，避免意外副作用（比如调用带副作用的 getter）
- 解决办法：暂停状态下，点击监视项右侧的 刷新图标（或右键 → “重新评估”），它就会用当前帧作用域再跑一遍
如何用调用堆栈快速定位并监视特定帧里的变量
你不需要记住所有变量名，直接从源码里“抓取”更可靠。
- 调试暂停后，用鼠标点开调用堆栈，选中你想分析的那一帧（比如
handleClick而不是最顶上的dispatchEvent） - 这时编辑器跳转到对应代码位置，Variables 面板也已切到该帧作用域
- 把光标悬停在你想盯的变量上（如
event.target），右键 → “添加到监视”，VS Code 会自动填入表达式，且后续每次暂停都在这个帧里求值 - 如果变量是深层嵌套的（如
props.children[0].props.id），别手敲——先在调试控制台（Ctrl+Shift+Y）里试运行确认可访问，再加进监视
监视 + 调用堆栈排查异步/闭包问题的实际路径
闭包变量、Promise 回调、事件处理器这些场景下，变量不在当前帧，但可能藏在上层帧的 Closures 区块里。监视必须配合堆栈切换才能看到真实值。
- 断点打在
then回调里，监视data显示not available？先点调用堆栈里上一层（比如发起请求的函数帧），再看 Variables →Closures展开，找那个闭包变量 - 把
data从Closures里右键“添加到监视”，然后切回回调帧——监视项仍有效，因为表达式是data，而 JS 引擎能沿作用域链找到它 - 注意：TypeScript 编译后若没生成完整 source map，闭包变量名可能被压缩成
_a类似形式，此时监视原始名会失败，得用编译后的名或改用调试控制台直接查
真正容易被忽略的是：监视表达式没有“作用域快照”，它每次都是实时求值。你在第 3 帧里加的 user.id，切到第 1 帧时如果 user 不在作用域链上，它就真会报错——这不是 UI 同步问题，是 JavaScript 执行模型本身决定的。
