解释 JavaScript 的作用域链是如何工作的
作用域链是 JavaScript 在查找变量时,从内到外依次查找的作用域链表。
执行上下文与作用域
每个函数在创建时会保存一个 [[Environment]] 内部属性,指向定义时的词法环境。函数调用时创建执行上下文,其作用域链 = 函数自身作用域 → 外层作用域 → ... → 全局作用域。
const globalVar = 'global'
function outer() {
const outerVar = 'outer'
function inner() {
const innerVar = 'inner'
// 作用域链:inner → outer → global
console.log(innerVar) // 'inner' (自身)
console.log(outerVar) // 'outer' (外层)
console.log(globalVar) // 'global' (全局)
}
inner()
}词法作用域(静态作用域)
JavaScript 采用词法作用域:函数的作用域在定义时确定,而非调用时。
const value = 'outer'
function foo() {
console.log(value) // 'outer'(定义时决定)
}
function bar() {
const value = 'inner'
foo() // foo 依然访问外层的 'outer'
}
bar() // 输出 'outer'作用域链查找过程
- 在当前作用域查找变量
- 找不到 → 沿作用域链向上查找
- 找到则使用,未找到则
ReferenceError
欺骗词法作用域(不推荐)
eval():动态执行代码,可修改作用域with:创建临时作用域(严格模式禁用)
面试要点:作用域链在函数定义时确定(词法作用域),
this在函数调用时确定(动态绑定)。