js闭包

1.闭包的定义

闭包就是能够读取其他函数内部变量的函数。例如在javascript中，只有函数内部的子函数才能读取局部变量，所以闭包可以理解成“定义在一个函数内部的函数“。在本质上，闭包是将函数内部和函数外部连接起来的桥梁。（百度百科）

2.变量作用域

[w3c的定义]W3c

3.闭包的特点

①.闭包可以用在许多地方。它的最大用处有两个，一个是前面提到的可以读取函数内部的变量，另一个就是让这些变量的值始终保持在内存中。

function f() { 
 var count = 0; 
 return  function() { 
     count++; 
     console.info(count); 
 } 
} 
var t1 = f();
t1();     
t1();     
t1(); 

使用闭包有一个优点，也是它的缺点：就是可以把局部变量驻留在内存中，可以避免使用全局变量。(全局变量污染导致应用程序不可预测性，每个模块都可调用必将引来灾难，所以推荐使用私有的，封装的局部变量)。

如果要实现累加功能：

//累加
var age = 100;   //通过全局变量
function box(){
    age++;
}
box();
box();
box();
alert(age);  //103

function box(){  //使用匿名函数实现局部变量驻留内存从而进而累加
    var age = 100;
    return function(){
        age++;
        return age;
    };
}
var b =box();   //不能通过box()();来调用，这样每次都初始化age=100;
b();
b();
alert(b());//103
b=null;    //当不用时解除引用，等待垃圾回收

事例一：

function outerFn(){
  var i = 0; 
  function innerFn(){
      i++;
      console.log(i);
  }
  return innerFn;
}
var inner = outerFn();  //每次外部函数执行的时候,都会开辟一块内存空间,外部函数的地址不同，都会重新创建一个新的地址
inner();
inner();
inner();
var inner2 = outerFn();
inner2();
inner2();
inner2(); 

事例二：

var i = 0;
function outerFn(){
  function innnerFn(){
       i++;
       console.log(i);
  }
  return innnerFn;
}
var inner1 = outerFn();
var inner2 = outerFn();
inner1();
inner2();
inner1();
inner2();

事例三：

function outerFn(){
var i = 0;
  function innnerFn(){
      i++;
      console.log(i);
  }
  return innnerFn;
}
var inner1 = outerFn();
var inner2 = outerFn();
inner1();
inner2();
inner1();
inner2(); 

②.闭包就是可以创建一个独立的环境，每个闭包里面的环境都是独立的，互不干扰。每次外部函数执行的时候，外部函数的引用地址不同，都会重新创建一个新的地址。但凡是当前活动对象中有被内部子集引用的数据，那么这个时候，这个数据不删除，保留一根指针给内部活动对象(变量的值始终保持在内存中).

作用域链的机制导致一个问题，在循环中里的匿名函数取得的任何变量都是最后一个值。

下面的例子输出的结果都是5，也就是循环后得到的最大的i值。因为b[i]调用的是匿名函数，匿名函数并没有自我执行，等到调用的时候，box()已执行完毕，i早已变成5，所以最终的结果就是5个5。

改1中，我们通过匿名函数自我执行，立即把结果赋值给a[i]。每一个i，是调用方通过按值传递的，所以最终返回的都是指定的递增的i。而不是box()函数里的i。

//循环里的匿名函数取值问题
function box(){
    var arr=[ ];
    for(var i=0;i<5;++i){
        arr[i]=function(){   
            return i;
        };
    }
    return arr;
}
//alert(box());                  返回每个都是匿名函数体的数组
var b = box();
for(var i = 0;i<5;++i){
    console.log(b[i]());  
}


//改进1:立即执行匿名函数
function box(){
    var arr=[ ];
    for(var i=0;i<5;++i){
        arr[i]=(function(num){                //通过立即执行匿名函数
            return num;
        })(i);
    }
    return arr;
}
var b = box();
for(var i = 0;i<5;++i){
    console.log(b[i]);
}

//改进二：利用es6的块级作用域
function box(){
    let arr=[ ];
    for(let i=0;i<5;++i){
        arr[i]=function(){   
            return i;
        };
    }
    return arr;
}

var b = box();
for(let i = 0;i<5;++i){
    console.log(b[i]());  
}

在ES6之前，我们都是用var来声明变量，而且JS只有函数作用域和全局作用域，没有块级作用域，所以{}限定不了var声明变量的访问范围。

练习：

练习一：
function fn(){
	var a = 3;
	return function(){
		return  ++a;                                     
	}
}
console.log(fn()());  
console.log(fn()());

②.this的指向

实例一：
　　var name = "The Window";

　　var object = {
　　　　name : "My Object",

　　　　getNameFunc : function(){
　　　　　　return function(){
　　　　　　　　return this.name;
　　　　　　};

　　　　}

　　};

　　alert(object.getNameFunc()());


实例二：

　　var name = "The Window";

　　var object = {
　　　　name : "My Object",

　　　　getNameFunc : function(){
　　　　　　var that = this;
　　　　　　return function(){
　　　　　　　　return that.name;
　　　　　　};

　　　　}

　　};

　　alert(object.getNameFunc()());

闭包中使用this对象也可能会导致一些问题，this对象是在运行时基于函数的执行环境绑定的，如果this在全局范围就是window，如果在对象内部就指向这个对象。而闭包却在运行时指向window的，因为闭包并不属于这个对象的属性或方法。

闭包中的this将返回全局对象，浏览器中window对象，node中global对象，可以使用对象冒充或者赋值来解决闭包中this全局对象问题。

4、使用闭包的注意点

（1）由于闭包会使得函数中的变量都被保存在内存中，内存消耗很大，所以不能滥用闭包，否则会造成网页的性能问题，在IE中可能导致内存泄露。解决方法是，在退出函数之前，将不使用的局部变量全部删除。