闭包--解析-qyl

闭包--解析

一：什么是闭包？

官方”的解释是：闭包是一个拥有许多变量和绑定了这些变量的环境的表达式（通常是一个函数），因而这些变量也是该表达式的一部分。
一般性理解：闭包就是能够读取其他函数内部变量的函数。由于在Javascript语言中，只有函数内部的子函数才能读取局部变量，因此可以把闭包简单理解成“定义在一个函数内部的函数”。
所以，在本质上，闭包就是将函数内部和函数外部连接起来的一座桥梁。
1）函数嵌套函数；

2）内部函数可以应用外部函数的参数和变量；

3）参数和变量不会被垃圾回收机制所收回；

示例：a）；变量的作用域

要理解闭包，首先必须理解Javascript特殊的变量作用域。变量的作用域无非就是两种：全局变量和局部变量。

Javascript语言的特殊之处，就在于函数内部可以直接读取全局变量。

var n=1; //全局变量

　　function f1(){
　　　　alert(n);
　　}

　　f1(); //运行结果：1

另一方面，在函数外部自然无法读取函数内的局部变量。

function f1(){
　　　　var n=999;
　　}

　　alert(n); // error

b)简单闭包就是函数的嵌套；

function Out()
{
var a = 5;
function Inner()
{
alert(a) ;
}
return Inner;
}
var Link = Out();
Link();

这个变量a是不会被JS中的垃圾回收机制所回收的，它会一直保存在内存当中。

二，闭包有哪些好处，应用在哪里？

希望有个变量长期驻扎在内存当中。
避免全局变量的污染；
私有成员的存在；

示例：a）：

代码一：

var a = 1; //这个示例演示的是外部变量对函数的污染；
function outer()
{
   function inner()
    {
   a++;
   alert(a);
}
return inner;
}
var ss = outer();
ss(); //2
ss(); //3
ss(); //4
ss(); //5

alert(a) //5

function outer() //这个示例演示的将变量局部化的效果；
{
   var a = 1;
return function()
    {
  a++;
  alert(a);
}

}
var ss = outer();
ss(); //2
ss(); //3
alert(a); //error

闭包的用途：

function f1(){

　　　　var n=999;

　　　　nAdd=function(){n+=1}

　　　　function f2(){
　　　　　　alert(n);
　　　　}

　　　　return f2;

　　}

　　var result=f1();

　　result(); // 999

　　nAdd();

　　result(); // 1000

在这段代码中，result实际上就是闭包f2函数。它一共运行了两次，第一次的值是999，第二次的值是1000。 这证明了，函数f1中的局部变量n一直保存在内存中，并没有在f1调用后被自动清除。 为什么会这样呢？原因就在于f1是f2的父函数，而f2被赋给了一个全局变量，这导致f2始终在内存中，而f2的存在依赖于f1，因此f1也始终在内存中，不会在调用结束后，被垃圾回收机制（garbage collection）回收。这段代码中另一个值得注意的地方，就是“nAdd=function(){n+=1}”这一行，首先在nAdd前面没有使用var关键字，因此 nAdd是一个全局变量，而不是局部变量。其次，nAdd的值是一个匿名函数（anonymous function），而这个匿名函数本身也是一个闭包，所以nAdd相当于是一个setter，可以在函数外部对函数内部的局部变量进行操作。三，闭包的用法：

模块化代码
在循环中直接找到元素的索引；

var aaa = (function(){var a = 1; return function(){a++;alert(a)}})();//模块化代码
aaa(); //2
aaa(); //3

可以利用下面的作为练习：

下面两个函数是同一个函数，也就是函数声明改写为函数表达式： //函数声明改写函数表达式
function aaa()
{
alert(1);
}
aaa();//1 (function(){alert(1)})(); //函数表达式

模块化代码：

var aaa = (function(){

var a = 1;

function bbb(){
  a++;
  alert(a);
}

function ccc(){
  a++;
  alert(a);
}

return {

  b : bbb,
  c : ccc

}

})();

aaa.b(); //2
aaa.c(); //3
alert(bbb);//error

实例：在循环中直接找到元素的索引

window.onload = function(){
var aLi = document.getElementsByTagName('li');
for(var i=0;i<aLi.length;i++){
aLi[i].onclick = (function(i){ //外部参数穿进去
return function()

{
      alert(i); //调用外部参数
     }
   })(i);
}

};
</script>
</head>

还有另一种写法，其他代码就不写，只写主要部分程序；

window.onload = function(){
var aLi = document.getElementsByTagName('li');
  for(var i=0;i<aLi.length;i++){

  (function(i){

    aLi[i].onclick = function()

{
     alert(i);
    };

   })(i); //自执行的时候将i传进去
  }
};

四，闭包需要注意什么：
IE下容易引发内存泄露；

标签: 闭包 javascript

2014-12-09

qyl_anikin

闭包--解析