闭包

https://juejin.im/entry/589be51b2f301e00692ff583很棒的一篇文章　

js闭包：有权访问另一个函数作用域中变量的函数

闭包有三个特性： 

　　1.函数嵌套函数 
　　2.函数的内部可以调用外部的参数和变量 　　

　　3.参数和变量不会被垃圾回收机制回收 

 

优点：

        1、可以存储变量：子元素不会被回收，父元素内部设置变量，子元素调用，形成闭包。

        2、避免全局变量被污染。

缺点：

        1、长驻内存，会增大内存使用量，使用不当很容易造成内存泄露

 

 

• setTimeout也会引起闭包，setTimeout会和他同时执行的代码执行完成之后，再按照时间执行花括号里面的内容。
•  

 

举个例子：

 

 

function f1(){

　　　　var n=999;

　　　　nAdd=function(){n+=1}

　　　　function f2(){
　　　　　　alert(n);
　　　　}

　　　　return f2;

　　}

　　var result=f1();

　　result(); // 999

　　nAdd();

　　result(); // 1000

这个例子说明：f2是子函数，f1是f2的父函数，而f2被赋给全局变量，导致f2始终在内存中，f2又依赖于f1，因此f1也在内存中，所以f1的局部变量一直在内存中，不会在调用完以后，被垃圾回收机制回收。

垃圾回收：引用计数法和标记清除法。

先来看看函数

定义函数的方式有两种：

• 函数声明 
  function functionName(arg0,arg1,arg2){ 
  　　　　//函数体 
  　　｝　
• 函数表达式 
  var functionName=function(arg0,arg1,arg2){ 
  　　　　　//函数体 
  　　}

创建闭包

　　常见方式为在一个函数内部创建另一个函数。

　　function aaa(){
       　　　　var a=1;
       　　　　return function(){
       　　　　　alert(a++);
       　　 }
　　}
　　aaa();//1 执行后a++,然后a还在
　　aaa();//2

这是因为闭包会使变量始终保存在内存中。 
上面这样在一个函数内部嵌套一个匿名函数就已经算是一个闭包啦！ 
下面我们就来具体说一说…… 
　　 
　　如何在函数外取到函数内的变量

　　function outer(){
　　　　var x=10;
　　　　return function(){　　//函数嵌套函数
　　　　　　x++;
　　　　　　alert(x);
　　　　}
　　}
　　var y=outer();　　//将内部返回的函数赋给y，相当于：
　　//y= function(){　　
　　//　　　　x++;
　　//　　　　alert(x);
　　//　　}
　　y();　　//y函数第一次调用，相当关于outer()();结果为11
　　y();　　//y函数第二次调用，结果为12，实现了累加

　　这里，我们在outer函数的外部，通过返回outer内部嵌套的匿名函数来获取outer作用域内的变量x。我知道这个时候你一定想问，那outer函数的执行都已经结束了啊，不就应该销毁内部所有的局部变量么？为什么内部函数还能访问到x？下面我们来一一解惑。 
　　首先，我们就暂且称outer所包含的内部函数为小匿。小匿在自己的作用域中访问了外部函数outer中的变量x。即使小匿被返回了，而且是在其他地方被调用了，但它仍然可以访问变量x。之所以能够访问这个变量，是因为小匿的作用域链中包含outer的作用域。那么这又牵扯出一个新的问题，作用域链又是什么呢？ 
　　当某个函数被调用时，会创建一个执行环境，及相应的作用域链。我个人理解为，每一个函数在执行的时候会，都会吹一个泡泡把自己包在里面，这个泡泡就是执行环境，然后泡泡里面有一个整齐摆放的工具箱，那就是作用域链。函数在泡泡里面工作（执行）的时候，需要操作的数据（也就是变量），都在工具箱里按照严格的等级以此摆放。那么那些等级又是怎么划分的呢？像形参、函数内局部变量、arguements等这些都称为活动对象。而这个函数作用域链上的活动对象不仅是自己的，还有父亲的，祖父的。但在作用域链中，外部函数的活动对象始终处于第二位，外部函数的外部函数的活动和对象处于第三位……自己的活动对象永远都是第一位的。函数执行完成后，泡泡破灭，活动对象该释放的就会释放掉。 
　　闭包有三个特性： 
　　1.函数嵌套函数 
　　2.函数的内部可以引用外部的参数和变量 
　　3.参数和变量不会被垃圾回收机制回收 
下面我们来看一个闭包中最常见也是最典型的问题：闭包与索引值问题

function createFunction(){
  var result=new Array;
  for(var i=0;i<10;i++){
      result[i]=function(){
         return i;
      };
   }
   return result;
}

从表面来看，似乎每个函数都应该返回自己的索引值,即最后调用每一个result[i]并alert，感觉会弹出0~9，但实际会弹出10个10。因为实际的执行的时候，循环只会给每一个result[i]附一个函数，里面的i并不会同时赋值，只有在真正执行这个函数的时候，也就是要用到i的时候才开始给它赋值。而这个时候，循环已经跑完，i已经=10，所有会是10个10； 
　　但我们可以通过创建另一个匿名函数强制让闭包的行为符合预期。

 function(){
    var result=new Array();
    for(var i=0;i<10;i++){
      result[i]=function(num){
         return function(){ 
           return num;
         };
      }(i);
    }
     return result;
 }
 函数外：
  alert(result(0)());//0
  alert(result(1)());//1
  ……

由于函数参数是按值传递的，所以会将变量i的当前值复制给参数num。而在这个匿名函数内部又创建并返回了一个访问num 的闭包。这样一来，result数组中每个函数都有自己num变量的一个副本，因此可以返回不同是数值。

闭包的使用场景 
1.创建命名空间

//全局变量，test1是全局变量
var test1=111 
function outer(){
    alert(test1);
}
outer(); //111
alert(test1); //111



//闭包，test2是局部变量，这是闭包的目的
//我们经常在小范围使用全局变量，这个时候就可以使用闭包来代替。
(function(){
var test2=222;
function outer(){
    alert(test2);
}
function test(){
    alert("测试闭包："+test2);
}
outer(); //222
test(); //测试闭包：222
}
)(); 
alert(test2); //未定义，这里就访问不到test2

•  

2.给对象设置私有属性并利用特权(Privileged)方法访问私有属性

var Foo = function(){
      var name = 'fooname';
      var age = 12;
      this.getName = function(){
          return name;
      };
      this.getAge = function(){
          return age;
      };
  };
  var foo = new Foo();

  foo.name;        //  => undefined
  foo.age;         //  => undefined
  foo.getName();   //  => 'fooname'
  foo.getAge();    //  => 12

•  

3..函数外或在其他函数中访问某一函数内部的参数

function f1(){
    var test=111;
    tmp_test=function(){return test;} //tmp_test是全局变量,这里对test的引用，产生闭包
}

function f2(){
    alert("测试一："+tmp_test());
    var test1=tmp_test();
    alert("测试二："+test1);
}
f1();
f2();
//测试一：111
//测试二：111
alert(tmp_test()); //111
tmp_test=null;

•  

4.在函数执行之前为函数提供只有在函数执行或引用时才能知道的具体参数

//无法传参的情况
var parm=222;
function f1(){alert(111)}
function f2(obj){alert(obj)}
setTimeout(f1,500);//正确,无参数
setTimeout(f2,500);//undefined，传参失败
setTimeout(f2(parm),500);//参数无效，传参失败
setTimeout(function(parm){alert(parm)},500);//undefined，传参失败

//正确做法，使用闭包
function f3(obj){return function(){alert(obj)}}
var test2=f3(parm);//返回f3的内部函数的引用
setTimeout(test2,500);//正确,222
document.getElementById("hello").onclick=test2;//正确,222
document.getElementById("hello").attachEvent("onclick",test2);//正确,222

•  

5.记住索引

for (var i = 0; i < 5; i++) {
  (function(i) {
    setTimeout(function() {
      console.log(i);
    }, i * 1000);
  })(i);
}

• 小结 

　　虽然闭包可以通过另一个函数访问这个函数的局部变量。但由于闭包会携带包含他的函数的作用域，因此会比其他函数占用更多的内存，由于不同的垃圾收集方法，使用不当会造成内存泄露，也就是无法销毁驻留在内存中的元素。