分分钟搞懂JS-闭包函数

 1 //抛开概念！直接上代码，看实例
 2 
 3 var i=100;
 4 function add1(){
 5    alert(i); 
 6    i++;
 7 }
 8 function add2(){
 9    var j=100;
10    alert(j); 
11    j++; 
12 }
13 
14 //测试；
15 
16 //    add1(); //100
17 //    add1(); //101
18 //    add1(); //102
19 //    
20 //    add2(); //100
21 //    add2(); //100
22 //    add2(); //100
23 
24 /*为什么呢 原因很简单
25 i 是全局变量，只有页面关闭的时候，才会被GC回收；
26 j 是局部变量，函数执行完毕后就 被GC 回收；
27 
28 问：有没有办法将j 变成"全局变量"呢?
29 A同学答：有，将j写在外面（尼玛,傻逼啊）
30 B同学答，用return（有点接近了） 然后用全句变量来接收；
31 C同学答：闭包（完美）    
32 */
33 function add3(){
34   var j=100;
35   function fun(){
36    alert(j);
37    j++;
38   }
39    return fun; //注意这里；
40 }
41 
42 /*
43 测试：
44 
45 var obj=add3(); //执行add3()函数，同时返回了fun的引用（也就是fun的函数体）
46 
47 //直接alert(obj) 你会看到他的函数体- function fun(){....} 再加上一个括号()，就可以执行了
48 
49    obj(); //100
50 
51    obj(); //101
52 
53    obj();//102
54 
55  */

 1    var name="window";
 2    var object={
 3      name:"my object",
 4      getName:function (){
 5          return function (){
 6              return this.name; 
 7          }
 8      }
 9       
10   }
11  alert(object.getName()()); //window

  function f1(){
     var index=1;
     function f2(){
        alert(index);
        index++; 
     }
     return f2;
  }
  //调用
  var test=f1();
  test(); //1
  test(); //2
  test(); //3

  function outer(){
      var index=1;
     return function(){ //使用匿名函数
         alert(index);
         index++;
     }
  }
 var bibao=outer();
  bibao();
  bibao();
  bibao();

var outer=(function (){
      var index=1;
      return function (){
         alert(index);
         index++;  
      }
    
})();

outer();
outer();
outer();

var outer=null;
(function (){
    var index=1;
    function inner(){
      alert(index++);    
    };
    outer=inner;
})();
outer();
outer();
outer();

          <ul>
                    <li>123li>
                    <li>456li>
                    <li>789li>
                    <li>010li>
            ul>

window.Onload= function(){
            var lis = document.getElementsByTagName('li');
            var len=lis.length;
            for (var i=0;i){
                    lis[i].onclick = function(){        //当点击时for循环已经结束
                    alert(i);
                    };
            }
    }

window.Onload=function (){
     var index=0;
     var lis=document.getElementsByTagName("li");
     var len=lis.length;
     for(var i=0;i){
         lis[i].onclick=function (){
            alert(index);  //这样做，避免了i直接等于3，但是，却没有绑定到指定的对象上滴呀
            index++;
            if(index==len){
                index=0;
            }
         }
     }
}

window.Onload=function (){
  var lis=document.getElementsByTagName("li");
  var len=lis.length;
  for(var i=0;i){
      lis[i].index=i; //给每个变量动态的绑定一个属性，并赋值
      lis[i].Onclick=function (){
          var temp=this.index; //然后使用this关键字；
          alert(temp);  
      }
  }
}

function showInfo(obj,index){
   obj.onclick=function (){
     alert(index);   
   }
}

window.onload=function (){
  var lis=document.getElementsByTagName("li");
  var len=lis.length;
  for(var i=0;i){
     showInfo(lis[i],i);//i的改变和 index无关滴呀  
  }
}

   var index=1;
   
   function change1(){
     index=index+1;
   }
   
   function change2(){
    index=index+2;
   }
   change1();
   change2();
   alert(index); //4

   function change1(val){
     var temp=val;
     temp=temp+1;
   }
   
   function change2(val){
     var temp=val;
     temp=temp+2;
   }
   
   change1(index);
   change2(index);
   alert(index);
   //这样这不会改变；

 var index=1;
  (function (val){
     val=100;  
  })(index);
   
  (function (val){
     val=10000;  
  })(index);
   
   alert(index);

window.Onload=function (){
     var lis=document.getElementsByTagName("li");
     var len=lis.length;
     for(var i=0;i){
         (function (e){
              lis[e].onclick=function (){
                 alert(e);  
              }
         })(i); //形成一个独立的区域互补干扰
     }
}

         (function (e){
              lis[e].onclick=function (){
                 alert(e);  
              }
         })(i)

 //闭包概念：闭包是指某种程序语言中的代码块允许一级函数存在并且
  //在一级函数中所定义的自由变量不能被释放，直到一级函数释放前，
  //一级函数外也能应用这些未释放的自由变量；
 var shit=function (y){
    var x=y;
    return function (){
      alert(x++); //这里调用了一级函数的局部变量x
      //上下连个交换着尝试
      alert(y--); //这里调用参数变量，是自变量；    
    }}(5);
    
shit();  // 5 5
shit();  // 6 4
shit();  // 7 3

function closure(){
   var div=document.getElementById("div1");//div用完之后一直驻留在内存中
   div.Onclick=function (){
      alert(div.innerHTML);  //这里导致了内存泄露得呀
      //长期扎住在内存中得，没有得到是释放；   
   }
}

//优化：
function closure2(){
  var div=document.getElementById("div1");
  var text=div.innerHTML;
   div.onclick=function (){
      alert(text);  //这里导致了内存泄露得呀
      //长期扎住在内存中得，没有得到是释放；   
   }
   div=null;
}