闭包不是什么魔法
本篇文章介绍了闭包，方便程序员们能够进一步理解javascript代码，本文适合有一定编程经验的程序员，比如可以看懂如下代码：大神请绕道。
Example 1
function sayHello(name) {
var text = 'Hello ' + name;
var say = function() { console.log(text); }
say();
}
sayHello('Joe'); //Hello Joe
一旦深刻理解了核心概念，闭包就并不难分析和运用了。
一个关于闭包的案例
两句话总结：
- 第一级函数支持闭包。闭包它是一个表达式，可以在闭包的范围内引用变量（当它被首次声明），被赋值给变量，作为参数传递给函数，或作为函数结果返回。（译者注：在JavaScript世界中函数是一等公民，它不仅拥有一切传统函数的使用方式（声明和调用），还可以做到像原始值一样赋值、传参、返回，这样的函数也称之为第一级函数（First-class Function））
- 闭包是在函数开始执行时分配的堆栈帧，并且在函数返回后不会释放（就像“堆栈帧”分配在堆上而不是栈上！）。
Example 2
以下代码返回一个函数的引用：
function sayHello2(name) {
var text = 'Hello ' + name; // Local variable
var say = function() { console.log(text); }
return say;
}
var say2 = sayHello2('Bob');
say2(); // logs "Hello Bob"
大多数JavaScript程序员都了解如何将一个函数的引用赋给上述代码中的变量say2。如果你不了解，那么在学习闭包之前你需要先了解一下。一个使用C的程序员会将其看作是返回指向某函数的指针，会认为变量say和say2都是指向函数的指针。
C语言指向函数的指针和JavaScript的函数引用之间存在着很关键的区别。在JavaScript中，您可以将函数引用变量看作既包含指向函数的指针，也包含指向闭包的隐藏指针。
上述代码中存在一个闭包，因为匿名函数function() { console.log(text); }在另一个函数sayHello2()中声明。在这个例子中，如果你在另一个函数体里使用function关键字，那么你正在创建闭包。
在C语言和其他大多数类似语言中，在函数返回后，所有局部变量不可再被访问，因为堆栈帧已经被销毁了。
而在Javascript语言中，如果你在一个函数体内再声明一个函数，这个函数被返回到了全局，局部变量依然可以被访问。如上面所示，我们在函数sayHello2()返回后调用了函数say2()，请注意，变量text是函数sayHello2()的局部变量。
function() { console.log(text); } // Output of say2.toString();
注意say2.toString()的输出，我们可以看到这段代码引用了变量text，由于sayHello2()的局部变量被保存到闭包内，所以这个匿名函数可以引用存储"Hello Bob"的变量text。
在Javascript中函数引用包含指向它所创建的闭包的隐藏指针就类似于js中的事件委托（一个事情本需要自己做，但自己委托给别人做了）。
更多案例
出于某种原因，闭包似乎很难理解，但是当你多看一些案例之后，它的工作原理变得逐渐清晰（我花了很长时间才搞清楚）。我建议你仔细研究这些案例，直至弄明白闭包是如何工作的。如果你在没弄明白之前就使用闭包，就一定会碰到一些非常奇怪的错误。
Example 3
这个案例表明，局部变量没有被复制，而是它们的引用被保存。就好像当外部函数退出后在内存保留一个堆栈帧。
function say667() {
// Local variable that ends up within closure
var num = 42;
var say = function() { console.log(num); }
num++;
return say;
}
var sayNumber = say667();
sayNumber(); // logs 43
Example 4
所有这三个全局函数都有一个对同一个闭包的共同引用，因为它们都是在同一个setupSomeGlobals()函数中声明的。
var gLogNumber, gIncreaseNumber, gSetNumber;
function setupSomeGlobals() {
// Local variable that ends up within closure
var num = 42;
// Store some references to functions as global variables
gLogNumber = function() { console.log(num); }
gIncreaseNumber = function() { num++; }
gSetNumber = function(x) { num = x; }
}
setupSomeGlobals();
gIncreaseNumber();
gLogNumber(); // 43
gSetNumber(5);
gLogNumber(); // 5
var oldLog = gLogNumber;
setupSomeGlobals();
gLogNumber(); // 42
oldLog() // 5
这三个函数共用一个闭包——三个函数被定义时，函数setupSomeGlobals()的局部变量。
请注意，在上述案例中，如果再次调用setupSomeGlobals()，则会创建一个新的闭包（堆栈帧）。旧的gLogNumber, gIncreaseNumber, gSetNumber变量被具有新闭包的新函数覆盖（在Javascript中，无论何时在另一个函数内声明一个函数，每次调用外部函数时都会重新创建内部函数）。
Example 5
这个案例对于许多人来说是一个大难题，你需要仔细理解一下。如果你要在一个循环体中定义一个函数，要非常小心，闭包中的局部变量可不会想你想当然那样工作。
function buildList(list) {
var result = [];
for (var i = 0; i < list.length; i++) {
var item = 'item' + i;
result.push( function() {console.log(item + ' ' + list[i])} );
}
return result;
}
function testList() {
var fnlist = buildList([1,2,3]);
// Using j only to help prevent confusion -- could use i.
for (var j = 0; j < fnlist.length; j++) {
fnlist[j]();
}
}
testList() //logs "item2 undefined" 3 times
这行代码result.push( function() {console.log(item + ' ' + list[i])} );所示，将一个匿名函数的引用添加到result数组中三次。如果你对匿名函数不熟悉，也可当成如下：
pointer = function() {console.log(item + ' ' + list[i])};
result.push(pointer);
请注意，当案例执行时，"item2 undefined"会输出三次！这是因为跟之前案例一样，buildList的局部变量只有一个闭包。当在执行fnList[j]()调用匿名函数时，三个匿名函数都共用一个闭包，并且它们使用的是循环结束后的当前值作为该闭包中的i和item（循环已完成，i的值为3，item值为"item2"）。请注意，该循环从0开始索引，到循环结束前item值为"item2"，而i ++会将i值增加到3。
Example 6
此案例显示：在外部函数退出前，外部函数内声明的所有全局变量都包含在闭包内。请注意，变量alice实际上是在匿名函数之后声明的，匿名函数是最先声明的，当该函数被调用时，它仍然可以访问alice变量，因为该变量处于相同作用域内（Javascript声明提升）。另外，sayAlice()()只是直接调用从sayAlice()返回的函数引用。
function sayAlice() {
var say = function() { console.log(alice); }
// Local variable that ends up within closure
var alice = 'Hello Alice';
return say;
}
sayAlice()();// logs "Hello Alice"
需要注意的是：say变量也在闭包中，可以通过sayAlice()中任何可能声明的其他函数访问，或者可以在内部函数内递归访问。
Example 7
最后这个案例表明，每次调用外部函数都会为局部变量创建一个单独的闭包。不是每个函数声明都有单独闭包，而是每次函数调用都会创建一个闭包。
function newClosure(someNum, someRef) {
// Local variables that end up within closure
var num = someNum;
var anArray = [1,2,3];
var ref = someRef;
return function(x) {
num += x;
anArray.push(num);
console.log('num: ' + num +
'; anArray: ' + anArray.toString() +
'; ref.someVar: ' + ref.someVar + ';');
}
}
obj = {someVar: 4};
fn1 = newClosure(4, obj);
fn2 = newClosure(5, obj);
fn1(1); // num: 5; anArray: 1,2,3,5; ref.someVar: 4;
fn2(1); // num: 6; anArray: 1,2,3,6; ref.someVar: 4;
obj.someVar++;
fn1(2); // num: 7; anArray: 1,2,3,5,7; ref.someVar: 5;
fn2(2); // num: 8; anArray: 1,2,3,6,8; ref.someVar: 5;
总结
如果对闭包并不完全明白，那么最好的办法就是回过头研究研究这些案例。我对闭包和堆栈帧等概念的解释可能在专业上并不完全正规，这都是为了帮助大家更好地理解。一旦这些基础知识得到掌握，你可以在以后的日子里去抠那些更专业的细节。
最后几点
- 任何时候，你在一个函数体内用了另外一个函数，闭包就产生了。
- 任何时候，你在一个函数体内用了
eval()，闭包就产生了。在eval中的内容可以引用函数里的局部变量，你甚至可以在eval内声明新的局部变量，比如：eval('var foo = ...')。 - 当你在一个函数体内使用构造函数(
new Function(...))，不会产生闭包（这个构造函数不能引用外部函数的局部变量）。 - Javascript中的闭包就像外部函数返回后，用来保存所有局部变量的存储副本一样。
- 最好可以这样认为：闭包只是一个函数的入口，函数的局部变量被添加到这个闭包中。
- 每次调用一个带有闭包的函数时，都会保存一组新的局部变量（假定该函数内包含一个函数声明，并且返回到外部，或者以某种方式为其保留外部引用）。
- 两个函数可能看起来代码相同，但是由于“隐藏”的闭包，它们有着完全不同的行为。我并不认为通过Javascript代码可以很容易看出一个函数引用是否拥有闭包。
- 如果你想进行动态修改代码（比如：
myFunction = Function(myFunction.toString().replace(/Hello/,'Hola'));），如果myFunction是闭包，将行不通（当然，你应该永远不会想要这样进行源代码字符串替换，但是……）。 - 很可能出现这种情况：在函数体内的函数声明中还有函数声明，那么你会发现有不止一个层级上的闭包出现。
- 我怀疑Javascript中的闭包和那些函数式语言的闭包不同。
闭包的应用（译者注）
- 实现封装，私有化属性/变量
- 模块化开发，防止全局污染
- 用作缓存
- 用作公有变量
- 等等……
闭包的危害（译者注）
闭包会导致原有作用域链不释放，造成内存泄露。
感谢
如果你刚刚学会了闭包（在这篇文章或者其他地方），欢迎提出任何意见或建议，因为你的反馈可能会使这篇文章更加清晰完善，为更多有需要的人带来方便。我不是Javascript专家也不是闭包专家，欢迎批评指正。
