JS-3-闭包

来源:互联网 发布:跆拳道教学软件 编辑:程序博客网 时间:2024/05/22 09:50

一、概念

是引用了自由变量的函数。这个被引用的自由变量将和这个函数I同存在,即使已经离开了创造他的环境也不例外。所以,有另一种说法认为闭包是由函数和与其相关的引用环境组合而成的实体

二、好处:

1.减少全局变量

2.减少传递给函数的参数变量

3.封装

事例1:

function f1(){

var a = 10;

var b = 20;

function f2(){

console.log(a)

}

f2();

}

f1();


事例2:

function f(){

var a =0;

return function(){

a++;

alert(a);

}

}

var result = f();

result();


事例3:

function cal Factory(base){

return function(max){

var total = 0;

for(var i=1;i<=max;i++){

total+=i

}

return total + base;

}

}

var adder = calFactory(2);

alert(adder(3))

alert(adder(4));

var adder2 = calFactory(1);

alert(adder2(3))

事例4:

(function(){

var m = 0;

function getM(){

return m;

}

function setM(val){

m = val;

}

window.g = getM;

window.f = setM;

})();

f(12);

alert(g());

三、使用闭包的注意点

1.对捕获的变量只是个引用,不是复制

事例:

function f(){

var num = 1;

function g(){

alert(num);

}

num++;

g();

}

f();


2.父函数每调用一次,会产生不同的闭包

事例:

function f(){

var num = 1;

return function(){

num++;

alert(num);

}

}

var result1 = f(); //后两次没在重新声明

result1(); //2

result1(); //3

var result2= f();

result2(); //2

result2(); //3

3.循环中的问题

<div id="1">1</div>

<div id="2">2</div>

<div id="3">3</div>

错误:

for(var i=1;i<=3;i++){

var ele = document.getElementById(i);

ele.onclick=function(){ //i是全局的i,预定义时候正常,因为没有执行,所以,在执行的时候,弹出的都是4

alert(i);

}

}

正确:

for(var i=1;i<=3;i++){

var ele = document.getElementById(i);

ele.onclick=(function(id){ //每调用一次,产生一个新的闭包

return function(){

alet(id)

})(i);

}

}


原创粉丝点击