标签：js   闭包   

有关JS中闭包的理解和使用。

一、简介

       子函数可以使用父函数中的局部变量，这种行为就叫做闭包。通常指，有权访问另一个函数作用域中的变量的函数。创建时，通常在一个函数中创建另一个函数，通过另一个函数访问这个函数的局部变量。

function box() {
  var user = 'Lee';
  return function () { //通过匿名函数返回 box()局部变量
  return user;
  };
}
alert(box()());

在这里看似没什么作用，有点儿画蛇添足。那么为什么还要使用闭包呢？

当然，它也有自己的优点：通过闭包实现变量永驻内存，避免全局变量实现累加

 二、利用闭包实现累加

     传统方式：声明一个全局变量实现累加

		var age=100; //全局变量的声明
		function box(){
			age++;
		}
		box();
		alert(age);

    局部变量方式：

function box(){		var age=100;
			age++;
			return age;
		 }
		 
		 alert(box());  //需要多次调用box方法来进行，每次执行都会对age进行重新初始化始终为101

利用闭包，变量永驻内存，实现累加：

		function box(){
			var age=100;   //box中的局部变量
			return function(){ //匿名函数
				age++;    
    				return age;
			}
  		}
		 var b=box();  
		 alert(b());  //这里调用多次box函数后可实现累加，内存中保留有age变量的值
		 alert(b());

 三、循环中的闭包

闭包在循环中的应用可利用下面这些方法来达到同样的效果

    1、匿名函数返回一个数组

function box(){
	var arr=[];
	for (var i=0;i<5;i++){
		arr[i]=function(){
  		return i;
		 }
	 }
	return arr;  //返回一个数组
}
for (i=0;i<5;i++)  //连续实现循环输出
{
	alert(box()[i]()); //结果为5个5
}

       原因：在每次输出循环时，我们都会执行box（）函数，而每次执行时，其实，box函数已经执行完毕，即其实，每次执行输出循环中的一次，box中for循环就执行了5次，即执行到i++=5，而每次循环arr[i]=5，因此每次输出循环结果都为5.其实，这里输出循环中每次输出的都是box函数for循环了5次以后的结果5，而box内部每次循环时，因匿名函数未自我执行，结果均为匿名函数的函数体。只有到第五次，结果才为5。

问题出现在哪里呢？如果在每次循环结束时，匿名函数可以自我执行，那么每次循环完成后，就会返回arr，数组中就会有5个元素分别为0,1,2,3,4,那么在接下来的循环输出时，就可以将这5个元素依次输出了。具体解决方案详见2.直接传参自我执行。

    2、直接传参自我执行

function box(){
	var arr=[];
	for(var i=0;i<5;i++){
		arr[i]=(function (num){
			return num;
		})(i); //通过直接传参自我执行实现循环挨个输出
	}
	return arr;  //自我执行后，每次循环都会返回arr
}
var b=box();
for(var i=0;i<5;i++){
	alert(b[i]);//这里直接b[i]即可，不用再执行内部的匿名函数了
}

三、循环中返回匿名函数

function box(){
	var arr=[];
	for(var i=0;i<5;i++){
	arr[i]=(function (num){
	//num在这里
		return function(){ //返回一个闭包
			return num;
		}
	    })(i); //把i传给num
      }
	return arr;
}
 var b=box();
 for( var i=0;i<5;i++){ 
	alert(b[i]());
 }

      小结：通过闭包来实现变量存储在内存中，在很多应用中确实很方便，但是由于它占据了内存，所以在一些用到大量变量的程序中，会影响到程序执行的性能，所以闭包还是要慎用！

JS基础——闭包

标签：js   闭包   

原文地址：http://blog.csdn.net/wangyy130/article/details/39831695