JavaScript 闭包详解：理解作用域链的奥秘

什么是闭包？

闭包是指函数能够记住并访问其创建时的作用域，即使该函数在当前作用域外执行。

基础示例

function createCounter() {
  let count = 0;
  return function() {
    count++;
    return count;
  };
}

const counter = createCounter();
console.log(counter()); // 1
console.log(counter()); // 2
console.log(counter()); // 3

count 变量被"封闭"在闭包中，外部无法直接访问。

作用域链

JavaScript 采用词法作用域，函数可以访问：

1. 自己的作用域
2. 外层函数的作用域
3. 全局作用域

实际应用场景

1. 数据私有化

function createBankAccount(initialBalance) {
  let balance = initialBalance;
  return {
    deposit: (amount) => { balance += amount; },
    withdraw: (amount) => { balance -= amount; },
    getBalance: () => balance
  };
}

2. 函数工厂

function multiplyBy(factor) {
  return function(num) {
    return num * factor;
  };
}
const double = multiplyBy(2);
const triple = multiplyBy(3);

3. 事件处理器

function setupButtons() {
  for (let i = 0; i < 5; i++) {
    document.getElementById(`btn${i}`)
      .addEventListener("click", () => {
        console.log(`Button ${i} clicked`);
      });
  }
}

常见陷阱

循环中的闭包问题

// ❌ 错误示例
for (var i = 0; i < 5; i++) {
  setTimeout(() => console.log(i), 1000);
}
// 输出：5, 5, 5, 5, 5

// ✅ 正确示例
for (let i = 0; i < 5; i++) {
  setTimeout(() => console.log(i), 1000);
}
// 输出：0, 1, 2, 3, 4

内存管理

闭包会持有外部变量引用，可能导致内存泄漏。不需要的闭包应及时解除引用。

理解闭包是掌握 JavaScript 的关键一步！