参考: http://www.runoob.com/js/js-function-closures.html
http://kb.cnblogs.com/page/110782/
闭包的几个关键点:
1) 理解JavaScript变量作用域: 全局变量和局部变量
2) 代码结构: 外部function定义内部function, 内部function作为外部function的返回值
3) 内部function可以访问外部function的局部变量; 外部function的局部变量将一直存在于内存中
为什么使用闭包时外部函数的局部变量将一直存在于内存中?
因为外部function返回内部function的引用,并且这个引用又引用了外部function的局部变量,所以外部function的局部变量将一直存在内存中
计数器的困境:
设想下如果你想统计一些数值,且该计数器在所有函数中都是可用的。
你可以使用全局变量,函数设置计数器递增:
var counter = 0; function add() { counter += 1; } add(); add(); add(); // 计数器现在为 3
计数器数值在执行 add() 函数时发生变化。
但问题来了,页面上的任何脚本都能改变计数器,即便没有调用 add() 函数。
如果我在函数内声明计数器,如果没有调用函数将无法修改计数器的值:
function add() { var counter = 0; counter += 1; } add(); add(); add(); // 本意是想输出 3, 但事与愿违,输出的都是 1 !
使用闭包解决计数器问题:
var func = function () { var counter = 0; return function () {return counter += 1;} } var add = func(); add(); add(); add(); // 计数器为 3
或函数自我调用
var add = (function () { var counter = 0; return function () {return counter += 1;} })(); add(); add(); add(); // 计数器为 3