JavaScript 闭包详解：从原理到实战

什么是闭包？

闭包是指函数能够记住并访问其词法作用域，即使函数在作用域外执行。

基础示例

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

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

内部函数记住了 count 变量，这就是闭包。

闭包的三大用途

1. 数据私有化

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

2. 函数工厂

function multiplier(factor) {
  return function(number) {
    return number * factor;
  };
}

const double = multiplier(2);
const triple = multiplier(3);

3. 回调函数

function setupButton() {
  let clickCount = 0;
  document.getElementById("btn").onclick = function() {
    clickCount++;
    console.log(`Clicked ${clickCount} times`);
  };
}

常见陷阱

循环中的闭包

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

// ✅ 正确 - 使用 let
for (let i = 0; i < 3; i++) {
  setTimeout(() => console.log(i), 100);
}
// 输出：0, 1, 2

内存管理

闭包会阻止变量被垃圾回收，使用后应及时解除引用。

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