1. 原理与概览
1.1 闭包与自由变量的定义
在理解JavaScript中闭包时，关键是认识到它们是“函数与它的词法作用域的组合”，从而使得自由变量能在后续调用中持续可用。闭包让一个函数在定义时所在的作用域仍然可访问，即使外层函数已经执行完毕。绑定的持续性使得外部变量不会在外层函数结束后立即消失。
另外，了解词法作用域非常重要，因为它决定了闭包能看到哪些变量。由于静态作用域的特性，变量绑定在定义时就确定，不会被后续的执行上下文改变所干扰。
1.2 作用域链与环境对象
闭包依赖的核心机制是作用域链，它由当前函数的变量对象以及外层函数的变量对象组成。当内部函数访问一个在外部作用域定义的变量时，解释器沿着这个链路逐层向外查找，直到找到变量或抛出 ReferenceError。
运行时的环境对象记录了变量绑定、对外部引用以及访问控制等信息。随着闭包的形成，环境对象不会因为外部函数结束而被垃圾回收，从而实现了对外部自由变量的长期访问。
2. 捕获自由变量的方式
2.1 直接捕获与引用绑定
在JavaScript中，闭包捕获的是变量的绑定，而非某一时刻的具体数值。因此，如果外部作用域中的变量在闭包创建后发生变化，闭包看到的就是更新后的值。绑定在闭包创建时被捕获，但变量的值会在后续改变时同步更新。
示例展示了如何通过外部变量来驱动一个闭包的行为，这也是闭包最常见的用途之一：把外部状态“推入”到一个可重复调用的函数。
function createCounter(){let count = 0; // 闭包捕获的自由变量return function(){count++;return count;};
}
const next = createCounter();
console.log(next()); // 1
console.log(next()); // 2
2.2 闭包的生命周期与垃圾回收
由于闭包对外部变量持有引用，外部变量的生命周期因此被延长，直到不再需要该闭包才会被垃圾回收。这也是使用闭包时需要关注的一个风险点：避免无用的引用导致内存泄漏，应在不再需要时清空对闭包的引用。
在实际编码中，常见做法是将闭包限制在必要的作用域内，或者在不再使用时明确将相关变量设为null以解除引用。
3. 实现机制与原理细节
3.1 作用域链与环境对象的运行机制
JavaScript引擎在编译阶段确定了词法环境，运行时维护一层层的作用域链。当创建一个闭包时，内部函数会捕获到外部的作用域链信息，确保它在未来调用时仍然能够访问外部变量。
重要的是理解：外部变量在闭包中并非“拷贝值”，而是通过绑定持续可访问。随着闭包引用的持续存在，环境对象也会持续存在，从而实现对自由变量的持续访问。
4. 实战代码示例
4.1 简单计数器闭包
目的在于演示如何通过闭包捕获一个私有变量，并对其形成受控访问。该模式常用于实现私有状态保护，避免外部直接修改。
function createCounter(){let count = 0; // 闭包捕获的自由变量return function(){count++;return count;};
}
const next = createCounter();
console.log(next()); // 1
console.log(next()); // 2
4.2 循环中的变量捕获陷阱与对策
在使用var定义循环变量时，闭包通常会抓取同一个绑定，导致输出不符合预期。为解决这一陷阱，可以使用<let替代var，或通过自执行函数(IIFE)为每次循环创建一个独立的绑定。
// 致命陷阱示例（var）
// 3 次输出都是 3
for (var i = 0; i < 3; i++) {setTimeout(function(){ console.log(i); }, 100);
}// 解决方案1：使用let
for (let i = 0; i < 3; i++) {setTimeout(function(){ console.log(i); }, 100);
}// 解决方案2：使用 IIFE
for (var j = 0; j < 3; j++) {(function(index){setTimeout(function(){ console.log(index); }, 100);})(j);
}
4.3 惰性求值与缓存（memoization）
通过闭包实现的缓存机制，可以将重复计算的结果保存在私有存储中，后续对同一输入直接返回缓存结果，提升性能。该模式广泛应用于昂贵计算、耗时数据处理等场景。
function memoize(fn){const cache = new Map();return function(...args){const key = JSON.stringify(args);if (cache.has(key)){return cache.get(key);}const result = fn.apply(this, args);cache.set(key, result);return result;};
}
// 使用示例
function expensive(x, y){// 假设这是一个耗时运算let sum = 0;for (let i = 0; i < 1000000; i++){sum += (x * y) ^ (i & 1);}return sum;
}
const memoExp = memoize(expensive);
console.log(memoExp(3,5)); // 第一次调用，触发计算
console.log(memoExp(3,5)); // 直接从缓存返回
