作用域链详解，新手看这里！

作用域链是什么？

作用域链是 JavaScript 解析变量的位置的一种机制。它由一个变量对象列表组成，每个列表都对应着当前执行上下文中的一个作用域。当 JavaScript 引擎搜索变量时，它会从当前作用域开始，然后沿着作用域链向上搜索，直到找到该变量。

作用域链是如何工作的？

当 JavaScript 引擎进入一个新的执行上下文时，它会创建一个新的变量对象，并将它添加到作用域链的顶部。该变量对象存储着该执行上下文中的所有变量和函数。当 JavaScript 引擎搜索一个变量时，它会从当前作用域开始搜索。如果它在当前作用域中找不到该变量，它就会沿着作用域链向上搜索，直到找到该变量。

作用域链有什么用？

作用域链使我们能够在 JavaScript 中创建分层的作用域。这对于组织代码和防止变量冲突非常有用。例如，我们可以创建一个全局作用域，并将所有全局变量存储在其中。然后，我们可以创建一个局部作用域，并将所有局部变量存储在其中。这样，我们就能够防止局部变量与全局变量冲突。

如何使用作用域链？

我们可以通过使用 JavaScript 的 var、let 和 const 来使用作用域链。var 关键字声明一个变量，并将其存储在当前作用域中。let 关键字声明一个变量，并将其存储在当前作用域中，但该变量只能在声明它的块中使用。const 关键字声明一个常量，并将其存储在当前作用域中，该常量不能被重新赋值。

作用域链的例子

// 创建一个全局变量
var globalVariable = 10;

// 创建一个局部变量
function myFunction() {
  var localVariable = 20;

  // 访问全局变量
  console.log(globalVariable); // 输出：10

  // 访问局部变量
  console.log(localVariable); // 输出：20
}

// 调用函数
myFunction();

在这个例子中，全局变量 globalVariable 存储在全局作用域中。局部变量 localVariable 存储在 myFunction 函数的作用域中。当 myFunction 函数被调用时，JavaScript 引擎会创建一个新的变量对象，并将它添加到作用域链的顶部。该变量对象存储着 localVariable 变量。当 JavaScript 引擎搜索 globalVariable 变量时，它会从当前作用域开始搜索。它会找到 globalVariable 变量，并将其输出到控制台。当 JavaScript 引擎搜索 localVariable 变量时，它会从当前作用域开始搜索。它会找到 localVariable 变量，并将其输出到控制台。

结论

作用域链是 JavaScript 中一种非常重要的机制。它使我们能够创建分层的作用域，并防止变量冲突。通过理解作用域链的工作原理，我们可以编写更强大和更可维护的 JavaScript 代码。