VSCode无独立“表达式求值扩展”，需按场景选择：调试中用Debug Console、编辑时用Live Code、可视化复杂结构用vscode-debug-visualizer。
VSCode 本身不提供“表达式求值扩展”的独立安装项，而是通过调试器、内置功能或第三方扩展组合实现该能力。直接装一个叫“Expression Evaluation”的扩展并不存在——你真正需要的是明确场景：是想在**调试中动态计算**，还是**编辑时实时看结果**，或是**可视化复杂结构**？选错方向会白装一堆扩展。
调试控制台里直接输入表达式求值
这是最轻量、最常用的方式，无需额外扩展，只要在断点暂停后打开调试控制台（Debug Console）即可。
- 支持任意合法 JS/TS 表达式：
user?.profile?.name、items.filter(x => x.active).length、JSON.stringify(data, null, 2) - 可调用无副作用函数，但注意：
calculateTotal()若含console.log或修改状态，结果仍会执行 - 变量作用域严格绑定当前断点位置——在 for 循环内输入
i看到的是当前迭代值，不是循环外的初始值 - 不支持顶层
await，除非你启用了 Node.js 的 ESM 模式且调试器配置了"console": "integratedTerminal"
Live Code 扩展实现编辑时自动求值
如果你想要边写代码边看到结果（比如数学公式、数组变换、对象结构），Live Code 是目前最稳定的方案。
- 安装后，用快捷键
Cmd+K L（macOS）或Ctrl+K L（Windows/Linux）打开侧边预览 - 它只对顶层表达式求值，不执行函数定义、类声明或
if块——所以const x = 1 + 2;不会显示结果，但1 + 2会直接显示3 - 支持
import和路径别名，前提是项目有jsconfig.json或tsconfig.json且已正确定义compilerOptions.paths - 不支持 JSX 渲染（如
<div>hello</div>会报错），但支持React.createElement形式调用
vscode-debug-visualizer 可视化表达式结果
当表达式返回的是树、链表、嵌套对象或数组，纯文本输出难读时，这个扩展能救命。
- 安装后运行命令
Debug Visualizer: New View，再在输入框里填表达式，比如treeRoot或graph.nodes - JavaScript/TypeScript 有专用数据提取器，能自动识别
next/left/right字段构建链表或二叉树视图 - 表格模式对数组-of-objects 效果极佳：
users.map(u => ({ name: u.name, age: u.age }))会渲染成带列头的表格 - 注意：它只在调试会话活跃时工作；非调试状态下输入表达式会提示 “No active debug session”
避免踩坑：调试控制台 vs Live Code vs Visualizer 的边界
三者能力重叠但定位不同，混用反而容易困惑。
-
Debug Console是调试上下文专属，适合探查「此刻」的变量和副作用小的计算，不能脱离断点使用 -
Live Code是编辑器上下文专属，适合验证逻辑片段、快速原型，但无法访问闭包外变量或调试状态 -
vscode-debug-visualizer是调试+可视化叠加层，依赖调试会话，且表达式必须返回可序列化的结构（不能含function、undefined、Symbol） - 所有扩展都不处理异步副作用：比如在
Live Code中写fetch('/api').then(r => r.json())，不会等待响应；在Debug Console中同理，除非你手动await并确保环境支持
真正容易被忽略的是：表达式求值是否在正确的上下文中执行。调试控制台里的 this 指向当前堆栈帧的 this，Live Code 里没有 this（顶层 this 是 undefined），而可视化器只取值不执行环境逻辑。选错工具，看到的就不是你认为的那个“值”。
