作用域与闭包：从不同角度理解代码运行逻辑

2023-12-17 07:45:11

在计算机编程的世界中，"作用域"和"闭包"是两个密切相关的概念，理解它们对于编写健壮可靠的代码至关重要。本文将深入探究这两个概念，并提供通俗易懂的解释，帮助你掌握它们的本质和应用。

作用域：变量的寻踪觅影

作用域是程序中定义变量和函数的上下文，决定了这些标识符在程序中的可见性和可访问性。在 JavaScript 等动态语言中，作用域遵循词法范围 规则，即由代码在文本中出现的顺序决定。

比如：

function outer() {
  var x = 10; // 声明在外部作用域中

  function inner() {
    var y = 20; // 声明在内部作用域中
    console.log(x); // 可以访问外部作用域的变量 x
    console.log(y); // 可以访问内部作用域的变量 y
  }

  inner();
}

outer();

在这个示例中，x 的作用域是外部函数 outer()，而 y 的作用域是内部函数 inner()。inner() 可以访问 outer() 中声明的变量 x，但 outer() 无法访问 inner() 中声明的变量 y。

闭包：超越作用域的变量连接

闭包是一种特殊的函数，它可以访问其定义作用域之外的变量，即使该作用域已经结束。这是因为闭包不仅包含函数代码，还包含对外部作用域中变量的引用。

function outer() {
  var x = 10;

  return function inner() {
    console.log(x); // 可以访问外部作用域的变量 x
  };
}

var innerFunction = outer();
innerFunction(); // 输出 10，即使 outer() 函数已经执行完

在这个示例中，innerFunction 是一个闭包，它引用了 outer() 函数中的变量 x，即使 outer() 函数已经执行完。

作用域与闭包的动态关系

尽管作用域是静态的，但在某些情况下，闭包可以间接地影响作用域。例如，闭包可以延长作用域中变量的寿命，即使该变量已经超出其定义的作用域。

考虑以下代码：

function outer() {
  var x = 10;

  function inner() {
    var y = 20;
    return function () {
      console.log(x, y); // 可以访问外部作用域的变量 x 和内部作用域的变量 y
    };
  }

  return inner();
}

var fn = outer();
fn(); // 输出 10, 20，即使 outer() 函数已经执行完