chrome/firefox调试时，scope面板按查找顺序分层显示local、closure、script、global及块级作用域，悬停预览有局限，应以scope面板为准，控制台求值作用域与断点一致。
在断点暂停时，JavaScript 作用域变量能直接、分层地看到，关键不是“找”，而是“看懂层级关系”。Chrome 和 Firefox 的开发者工具都把作用域链可视化呈现，你只需要知道每个条目代表什么、查找顺序怎么走，就能准确定位变量来源。
右侧 Scope 面板是核心入口
断点触发后，Sources（或 Debugger）面板右侧自动展开“Scope”区域，它按真实查找顺序从上到下排列：
-
Local：当前函数自身的词法环境，含用
let、const、var声明的变量，以及函数参数 -
Closure：一个或多个外层函数的闭包环境，每个 Closure 条目会标出函数名（如
outerFn），里面列出该函数内声明的变量 -
Script：当前模块（ES6 module）顶层声明的变量，比如
import的绑定或const api = '...' -
Global：全局对象（浏览器中是
window）上的属性，包括显式挂载的和隐式创建的
变量首次出现在哪一层，就说明它来自那一层——不用翻源码，一眼锁定定义位置。
块级作用域会“插队”，别跳过它
遇到 if、for、{} 这类块，且里面用了 let 或 const，它会作为一个独立的词法环境插入到作用域链中，排在 Local 下方、Closure 上方。这意味着：
- 块内访问同名变量，优先取块内声明，根本不会去外层 Closure 查
- 如果变量只在块里声明，块外访问会报错；块内却显示为 undefined，说明可能被提升干扰（比如用了
var） - 调试时先确认当前是否处于块内上下文，再看 Scope 列表里有没有对应块环境条目
悬停预览快但有局限，慎用于异步和闭包
鼠标悬停在代码变量上能快速弹出值，适合简单类型或浅层对象。但它依赖当前执行帧的活跃状态：
- 在
setTimeout、Promise.then等异步回调里暂停，悬停可能显示not available，因为变量已被垃圾回收 - 闭包变量若在外层函数已执行完毕，悬停可能不显示，但 Scope 面板里的 Closure 条目仍保留其值
- 对
this、arguments或箭头函数中的外层this，悬停有时不准确，务必以 Scope 面板为准
控制台里可动态查，但注意作用域边界
断点暂停后，切换到 Console 面板，可直接输入变量名或表达式求值，比如：
-
user.profile.name—— 查深层属性 -
Object.keys(localState)—— 列出对象键 -
typeof data === 'object'—— 做类型判断
但要注意：这里的作用域和当前断点完全一致，不能访问其他函数内的局部变量，也不能重新声明 const 变量。想验证某个变量是否真的“未定义”，直接输名字看报错信息，比猜更可靠。
Java免费学习笔记：立即使用
解锁 Java 大师之旅：从入门到精通的终极指南
