浅析 JavaScript 中作用域和作用域链

什么是作用域

在 JavaScript 中，作用域指的是变量与函数能够被访问的范围。通俗地说，作用域就是一个变量或函数在代码中的可见性。

在 JavaScript 中，存在三种作用域：

1. 全局作用域：定义在全局对象中的变量和函数，在整个程序中都可以被访问。
2. 函数作用域：定义在函数内的变量和函数，在函数内部和嵌套的函数内部可以被访问。
3. 块级作用域：通过 let 和 const 关键字定义的变量具有块级作用域。

作用域链

JavaScript 中的作用域链是指从当前作用域向上查找直到全局作用域，用于解析变量与函数的引用。

当引用一个变量或函数时，JavaScript 引擎会首先在当前作用域中查找，如果找到了则使用该变量或函数；如果没有找到，则会向上一级作用域查找，直到找到该变量或函数或者到达全局作用域。

示例说明1

// 全局作用域中定义变量 a
let a = "global";

function foo() {
  console.log(a); // a 的值为 "global"
}

foo(); // 输出 "global"

在上面的例子中，变量 a 定义在全局作用域中，在函数 foo 中可以直接访问到变量 a 的值，因为 foo 函数的作用域链包含了全局作用域。

示例说明2

function outer() {
  let a = "outer";

  function inner() {
    let b = "inner";
    console.log(a); // a 的值为 "outer"
    console.log(b); // b 的值为 "inner"
  }

  inner();
}

outer();

在上面的例子中，函数 inner 定义在函数 outer 中，因此函数 inner 的作用域链包含了函数 outer 的作用域。当在函数 inner 中引用变量 a 时，在函数 inner 的作用域链中向上查找到函数 outer 的作用域，找到了变量 a 并输出了它的值。而变量 b 则可以在 inner 函数中直接被访问到，因为它是定义在 inner 函数作用域内的。

结语

作用域和作用域链是 JavaScript 中非常重要的概念，了解它们对于理解 JavaScript 的变量和函数的作用是至关重要的。