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; //解决内存泄露
}