闭包与匿名函数：它们有什么不同？

2024-03-18 02:39:26

闭包与匿名函数：深入剖析

引言

在 JavaScript 中，闭包和匿名函数是两个密切相关的概念，但它们之间存在着细微的差异。理解这些差异对于充分利用 JavaScript 的强大功能至关重要。本文将深入探讨闭包和匿名函数的本质，它们的实现方式，以及它们在实际应用中的区别。

什么是闭包？

闭包是一种 JavaScript 特性，允许函数访问其创建范围之外的变量。这是通过将内层函数嵌套在外层函数中实现的，内层函数捕获外层函数的变量并保留对它们的引用。即使外层函数返回后，内层函数仍可以访问这些变量。

闭包在创建延迟执行的函数或需要访问外部状态的函数时尤其有用。例如，以下代码创建一个闭包，该闭包捕获变量 counter：

function createCounter() {
  let counter = 0;

  return function() {
    return counter++;
  };
}

const counter1 = createCounter();
const counter2 = createCounter();

console.log(counter1()); // 0
console.log(counter1()); // 1
console.log(counter2()); // 0

什么是匿名函数？

匿名函数 是没有名称的函数。它们通常使用函数字面量表示：

function() {
  // 函数体
}

匿名函数通常用于需要在运行时创建函数的场景，例如回调函数或事件处理程序。它们与闭包类似，因为它们都可以访问其创建范围之外的变量。

然而，匿名函数有一个关键区别：它们不能捕获其创建范围之外的变量。换句话说，匿名函数只能访问其直接父作用域中的变量。

闭包与匿名函数之间的区别

以下表格总结了闭包和匿名函数之间的关键区别：

特征	闭包	匿名函数
名称	有名称	没有名称
变量捕获	可以捕获创建范围之外的变量	不能捕获创建范围之外的变量
用途	创建延迟执行的函数或需要访问外部状态的函数	创建一次性函数或回调函数

代码示例

朋友的尝试：

for (let i = 0; i < 10; i++) {
  (function() {
    let i2 = i;
    setTimeout(function() {
      console.log(i2);
    }, 1000);
  })();
}

在朋友的代码中，匿名函数捕获变量 i 的副本，但它没有返回内层函数，因此不会创建闭包。因此，当外层函数返回后，内层函数不会保留对变量 i 的引用，导致在 setTimeout 回调中输出错误的值。

你的尝试：

for (let i = 0; i < 10; i++) {
  setTimeout(
    (function(i2) {
      return function() {
        console.log(i2);
      };
    })(i),
    1000
  );
}