JavaScript 执行上下文与作用域的奥秘：深入浅出

前端

2023-11-27 10:25:04

在 JavaScript 的纷繁世界中，执行上下文和作用域的概念就像两条交错的河流，深刻地影响着代码的行为。理解它们之间的关系至关重要，它能让我们驾驭 JavaScript 的力量，构建健壮且可维护的应用程序。

执行上下文：代码运行的舞台

执行上下文是 JavaScript 代码执行的环境。它定义了变量的可见性、函数的可调用性以及代码如何解析。每个执行上下文都有自己的变量对象，它存储着在该上下文中声明的所有变量。

作用域：变量的可见性领域

作用域定义了变量或函数的可访问范围。JavaScript 具有词法作用域，这意味着变量的作用域是由代码在源代码中声明的位置决定的。有两种主要的作用域：

全局作用域： 在脚本顶层声明的变量和函数具有全局作用域，可以在脚本的任何地方访问。
局部作用域： 在函数或块中声明的变量和函数仅在该作用域内可见。

作用域链：解析变量的寻宝之旅

当 JavaScript 引擎试图访问变量时，它会搜索一个称为作用域链的链条。作用域链从当前执行上下文开始，一直延伸到全局作用域。如果在当前执行上下文中未找到变量，引擎将沿作用域链向上搜索，直到找到该变量或达到全局作用域。

示例：作用域链在实践中的应用

var globalVar = "Hello";

function outerFunction() {
  var outerVar = "World";

  function innerFunction() {
    var innerVar = "!";

    console.log(globalVar); // "Hello"
    console.log(outerVar); // "World"
    console.log(innerVar); // "!"
  }

  innerFunction();
}

outerFunction();