解释 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'

作用域链查找过程

  1. 在当前作用域查找变量
  2. 找不到 → 沿作用域链向上查找
  3. 找到则使用,未找到则 ReferenceError

欺骗词法作用域(不推荐)

面试要点:作用域链在函数定义时确定(词法作用域),this 在函数调用时确定(动态绑定)。

同分类其他题目