闭包

1.什么是闭包？
函数嵌套函数，内部函数可以引用外部函数的参数和变量,参数和变量不会被垃圾机制所收回

a和b 都不会被垃圾机制所收回

test1:
function aa(){
var a=5;
function bb(){
alert(a); //5
}
return bb;
}
var c = aa(); //aa函数已经执行完,c 代表bb变量并没有被收回
c();

 

2.闭包有什么好处？
希望变量长期驻扎在内存中
避免全局变量的污染
私有成员的存在

test1:
var a = 1;
function aa(){
a++;
alert(a);
}
aa(); //2
aa(); //3

test2:
function aa(){
var a = 1;
a++;
alert(a)
}
aa(); //2
aa(); //2

test3闭包:
function aa(){
var a = 1;
return function(){
a++;
alert(a);
}
}
var b = aa();
b(); //2
b(); //3
alert(a) //错误

test4:
var aa=(function(){
var a = 1;
return function(){
a++;
alert(a);
}
})();

aa();
aa();

3.用法
模块化代码，减少前端的污染，把内部函数变成私有的
再循环中直接找到对应元素的索引

test1：模块化代码
var aa=(function(){
var a = 1;
function bb(){
a++;
alert(a);
}
function cc(){
a++;
alert(a);
}
return {
b : bb,
c : cc
}
})();
aa.b(); //2
aa.c(); //3

 

test2:

for(var i=0; i<oli.length; i++){

oli[i].onclick = function(){
alert(i); //3
}
}

利用闭包改写，把循环中的i当做参数传进来
for(var i=0; i<oli.length; i++){
(function(i){
oli[i].onclick = function(){
alert(i);
}
})(i);
}

for(var i=0; i<oli.length; i++){

oli[i].onclick = (function(i){
return function(){
alert(i)
}
})(i);
}

 

4.需要注意的地方
在IE 下可能会引发内存泄露

test1:
window.onload = function(){
var oDiv = document.getElementById('div1');
oDiv.onclick = function(){
alert(oDiv.id);
}

window.onunload = function(){ //解决内存泄露
oDiv.onclick = null;
}
}

test2:
window.onload = function(){
var oDiv = document.getElementById('div1');
var id = oDiv.id;
oDiv.onclick = function(){
alert(id);
}

oDiv = null; //解决内存泄露

}