闭包

1.利用闭包

    for(var i = 0 , length = btns.length; i < length ; ++i ){
        (function(i){
            var btn  = btns[i];
            btn.onclick = function(){
                alert('第'+(i+1)+'个按钮');
            }
         })(i)
    }

2.如何产生闭包？
*当一个嵌套的内部（子）函数引用了嵌套的外部（父）函数的变量（函数）时，就产生了闭包
//闭包到底是什么？
*使用chrome调式查看
*理解一：闭包是嵌套的内部函数
*理解二：包含被引用变量（函数）的对象
*注意：闭包存在于嵌套的内部函数中
//产生闭包的条件？
*函数嵌套
*内部函数引用了外部函数的数据（变量/函数）
3.

function fn1(){
   var a = 2 ;
   var b = 'abc';
   function fn2(){  //执行函数定义就会产生闭包（不用调用内部函数）
     console.log(a);
   }
}
fn1();

4.常见的闭包
1.将函数作为另一个函数的返回值

  function fn1(){
     var  a = 2 ;
     //关于闭包的生命周期，此时闭包产生了，因为函数提升，内部函数对象已经创建了
     function fn2(){
       //内部函数在定义时，要引用外部函数的变量，外部函数每次调用的时候，才叫做闭包
       a++;
       console.log(a);
      }
      return fn2;
  }
  var f = fn1();  //至此产生了一次闭包
  f();  //3
  f();  //4  
  fn1(); //至此产生了两次闭包
  f = null ; //此时闭包死亡（包含闭包的函数对象成为垃圾对象）

2.将函数作为实参传递给另一个函数调用

  function ShowDelay(msg,time){
      setTimeout(function(){
        alert(msg);
      },time)
  }
  ShowDelay('Vodka',3000);

3.闭包的作用
*使用函数内部的变量在函数执行完之后，仍然存活在内存中（延长局部变量的生命周期）
*让函数外部可以操作（读写）到函数内部的数据（变量/函数）
4.函数执行完毕后，函数内部声明的局部变量是否还存在？
一般来说是不存在的了，但存在于闭包中的局部变量则可能存在
5.在函数外部能直接访问函数内部的局部变量吗？
不能，但我们能通过闭包让外部操作它
6.闭包的应用：
*定义js模块，具有特定功能的js文件
*将所有数据和功能都封装在一个函数内部（私有的）
*只向外暴露一个包含n个方法的对象或函数
*模块的使用者，只需要模块暴露的对象调用方法来实现对应的功能

//myModule.js(方法一)
function myModule(){
	var msg  = 'My Vodka';
	function doSomething(){
		console.log('doSomething:  ' + msg.toUpperCase());
	}
	function doOtherthing(){
		console.log('doOtherthing:  '+msg.toLowerCase());
	}
	//返回一个对象,该对象含有模式中的所有方法
	return{
		doSomething: doSomething,
		doOtherthing: doOtherthing   //最后这里不能带分号，会报错
	}
}
//匿名函数调用（方法二）
(function(window){ //这里的window可以加，也可以不加（如果不加window，则封装对象必须为window的属性），不局限于window也可以写成其他字符代替，相应的地方也要改成其他字符，称为代码压缩
	//私有数据
	var  msg = 'My Vodka';
	function doSomething(){
		console.log('doSomething:  ' + msg.toUpperCase());
	}
	function doOtherthing(){
		console.log('doOtherthing:  ' + msg.toLowerCase());
	}
	//直接将内部函数封装成一个对象，使其成为window的一个属性
	window.myModule2  = {
		doSomething: doSomething,
		doOtherthing: doOtherthing
	}
})(window)
//引入Js文件
<script type="text/javascript" src="../js/myModule.js"></script>
		<script type="text/javascript">
			   var fn = myModule();
			   fn.doSomething();
			   fn.doOtherthing();
		</script>