摘要：該對象包含了函數(shù)的所有局部變量命名參數(shù)參數(shù)集合以及，然后此對象會被推入作用域鏈的前端。如果整個作用域鏈上都無法找到，則返回。此時的作用域鏈包含了兩個對象的活動對象和對象。

前端學習：教程&開發(fā)模塊化/規(guī)范化/工程化/優(yōu)化&工具/調(diào)試&值得關(guān)注的博客/Git&面試-前端資源匯總

歡迎提issues斧正：閉包

閉包(closure)是一個讓人又愛又恨的something，它可以實現(xiàn)很多高級功能和應(yīng)用，同時在理解和應(yīng)用上有很多難點和需要小心注意的地方。

閉包，官方對閉包的解釋是：一個擁有許多變量和綁定了這些變量的環(huán)境的表達式（通常是一個函數(shù)），因而這些變量也是該表達式的一部分。
簡單來說，閉包就是能夠讀取其他函數(shù)內(nèi)部變量的函數(shù)。在Javascript中，只有函數(shù)內(nèi)部的子函數(shù)才能讀取函數(shù)的局部變量，所以，可以把閉包理解成：定義在一個函數(shù)內(nèi)部的函數(shù)，也就是函數(shù)嵌套函數(shù)，給函數(shù)內(nèi)部和函數(shù)外部搭建起一座橋梁。

定義在一個函數(shù)內(nèi)部的函數(shù)。

函數(shù)內(nèi)部可以引用函數(shù)外部的參數(shù)和變量。

作為一個函數(shù)變量的一個引用，當函數(shù)返回時，其處于激活狀態(tài)。

當一個函數(shù)返回時，一個閉包就是一個沒有釋放資源的棧區(qū)。函數(shù)的參數(shù)和變量不會被垃圾回收機制回收。

Javascript允許使用內(nèi)部函數(shù)，可以將函數(shù)定義和函數(shù)表達式放在另一個函數(shù)的函數(shù)體內(nèi)。而且，內(nèi)部函數(shù)可以訪問它所在的外部函數(shù)聲明的局部變量、參數(shù)以及聲明的其他內(nèi)部函數(shù)。當其中一個這樣的內(nèi)部函數(shù)在包含它們的外部函數(shù)之外被調(diào)用時，就會形成閉包。

function a() {  
    var i = 0;  
    function b() { 
        console.log(i++); 
    }  
    return b; 
}
var c = a(); 
c();

1.由于閉包會使得函數(shù)中的變量都被保存在內(nèi)存中，內(nèi)存消耗很大。所以在閉包不用之后，將不使用的局部變量刪除，使其被回收。在IE中可能導(dǎo)致內(nèi)存泄露，即無法回收駐留在內(nèi)存中的元素，這時候需要手動釋放。

function a() {  
    var i = 1;  
    function b() { 
        console.log(i++); 
    }  
    return b; 
}
var c = a(); 
c(); //1
c(); //2
c(); //3   i不被回收
c = null;  //i被回收

2.閉包會在父函數(shù)外部，改變父函數(shù)內(nèi)部變量的值。如果你把父函數(shù)當作對象使用，把閉包當作它的公用方法，把內(nèi)部變量當作它的私有屬性，要小心，不要隨便改變父函數(shù)內(nèi)部變量的值。

var Xzavier = { 
    ten:10,  
    addTen: function(num) {  
       return this.ten + num;   //給一個數(shù)加10 
   }    
}
 
console.log(Xzavier.addTen(15));  //25
Xzavier.ten = 20; 
console.log(Xzavier.addTen(15));  //35

內(nèi)存泄漏指一塊被分配的內(nèi)存既不能使用，又不能回收，直到瀏覽器進程結(jié)束。

出現(xiàn)原因：

1.循環(huán)引用：含有DOM對象的循環(huán)引用將導(dǎo)致大部分當前主流瀏覽器內(nèi)存泄露。循環(huán) 引用，簡單來說假如a引用了b,b又引用了a,a和b就構(gòu)成了循環(huán)引用。
2.JS閉包：閉包，函數(shù)返回了內(nèi)部函數(shù)還可以繼續(xù)訪問外部方法中定義的私有變量。
3.Dom泄露，當原有的DOM被移除時，子結(jié)點引用沒有被移除則無法回收。  

Javascript中，如果一個對象不再被引用，那么這個對象就會被GC(garbage collection)回收。如果兩個對象互相引用，而不再被第3者所引用，那么這兩個互相引用的對象也會被回收。垃圾回收不是時時的，因為其開銷比較大，所以垃圾回收器會按照固定的時間間隔周期性的執(zhí)行。

函數(shù)a被b引用，b又被a外的c引用，這就是為什么函數(shù)a執(zhí)行后不會被回收的原因。

垃圾回收的兩個方法：

標記清除法：

1.垃圾回收機制給存儲在內(nèi)存中的所有變量加上標記，然后去掉環(huán)境中的變量以及被環(huán)境中變量所引用的變量（閉包）。
2.操作1之后內(nèi)存中仍存在標記的變量就是要刪除的變量，垃圾回收機制將這些帶有標記的變量回收。

引用計數(shù)法：

1.垃圾回收機制給一個變量一個引用次數(shù)，當聲明了一個變量并將一個引用類型賦值給該變量的時候這個值的引用次數(shù)就加1。
2.當該變量的值變成了另外一個值，則這個值得引用次數(shù)減1。
3.當這個值的引用次數(shù)變?yōu)?的時候，說明沒有變量在使用，垃圾回收機制會在運行的時候清理掉引用次數(shù)為0的值占用的空間。

函數(shù)a中i只有函數(shù)b才能訪問，而無法通過其他途徑訪問到。

function xzavier(){
    var i = 1;
    i++;
    console.log(i);
}
xzavier();   //2 
console.log(x);   // x is not defined                 
xzavier();   //2

由于閉包，函數(shù)a中i的一直存在于內(nèi)存中，因此每次執(zhí)行c()，都會給i自加1，且i不被垃圾回收機制回收。

function a() {  
    var i = 1;  
    function b() { 
        console.log(i++); 
    }  
    return b; 
}
var c = a(); 
c();  //1
c();  //2
c();  //3

var xzavier = (function(){
    var i = 1;
    var s = "xzavier";
    function f(){
        i++;
        console.log(i);
    }
    return {
        i:i,
        s:s,             
        f:f
    }
})();
xzavier.s;     //"xzavier"
xzavier.s;     //1
xzavier.f()    //2

方法2即使用了閉包的方法，當然操作DOM還是有別的方法的，比如事件委托就比較好用。

ul id="test">
    
first
    
second
    
third

// 方法一：this方法
var lis = document.getElementById("test").getElementsByTagName("li");
for(var i = 0;i < 3;i++){
    lis[i].index = i;
    lis[i].onclick = function(){
        console.log(this.index);
    };
} 
// 方法二：閉包方法
var lis = document.getElementById("test").getElementsByTagName("li");
for(var i = 0;i < 3;i++){
    lis[i].index = i;
    lis[i].onclick = (function(val){
        return function() {
            console.log(val);
        }
    })(i);
}
// 方法三 事件委托方法
var oUl = document.getElementById("test");
oUl.addEventListener("click",function(e){
    var lis = e.target;
    console.log(lis); 
});

邏輯隨業(yè)務(wù)復(fù)雜而復(fù)雜O(∩_∩)O~

var Xzavier = function(){       
    var name = "xzavier";       
    return {    
       getName : function(){    
           return name;    
       },    
       setName : function(newName){    
           name = newName;    
       }    
    }    
}();    

console.log(person.name); //undefined，變量作用域為函數(shù)內(nèi)部，外部無法訪問    
console.log(person.getName()); // "xzavier" 
person.setName("xz");    
console.log(person.getName());  //"xz"

function Xzavier(){       
    var name = "xzavier";       
    return {    
       getName : function(){    
           return name;    
       },    
       setName : function(newName){    
           name = newName;    
       }    
    }    
}

var xz = new Xzavier();  //Xzavier就是一個類，可以實例化
console.log(xz.getName());  // "xzavier"  

這里是原型繼承，我會在下一篇文章講一講原型繼承。

var X = function(){};
X.prototype = new Xzavier(); 
X.prototype.sports = function(){
    console.log("basketball");
};
var x = new X();
x.setName("xz");
x.sports();  //"basketball"
console.log(x.getName());  //"xz"

JavaScript作用域

作用域就是變量與函數(shù)的可訪問范圍，即作用域控制著變量與函數(shù)的可見性和生命周期。
在JavaScript中，變量的作用域有全局作用域和局部作用域兩種。

JavaScript作用域鏈

JavaScript函數(shù)對象擁有可以通過代碼訪問的屬性和一系列僅供JavaScript引擎訪問的內(nèi)部屬性。
其中一個內(nèi)部屬性是[[Scope]]，該內(nèi)部屬性包含了函數(shù)被創(chuàng)建的作用域中對象的集合。
這個集合被稱為函數(shù)的作用域鏈。

執(zhí)行上下文

當函數(shù)執(zhí)行時，會創(chuàng)建一個執(zhí)行上下文(execution context)，執(zhí)行上下文是一個內(nèi)部對象，定義了函數(shù)執(zhí)行時的環(huán)境。
每個執(zhí)行上下文都有自己的作用域鏈，用于標識符解析。
當執(zhí)行上下文被創(chuàng)建時，而它的作用域鏈初始化為當前運行函數(shù)的[[Scope]]包含的對象。

活動對象

這些值按照它們出現(xiàn)在函數(shù)中的順序被復(fù)制到執(zhí)行上下文的作用域鏈中。
它們共同組成了一個新的對象，活動對象(activation object)。
該對象包含了函數(shù)的所有局部變量、命名參數(shù)、參數(shù)集合以及this，然后此對象會被推入作用域鏈的前端。
當執(zhí)行上下文被銷毀，活動對象也隨之銷毀。
活動對象是一個擁有屬性的對象，但它不具有原型而且不能通過JavaScript代碼直接訪問。

查找機制:

1.當函數(shù)訪問一個變量時，先搜索自身的活動對象，如果存在則返回，如果不存在將繼續(xù)搜索函數(shù)父函數(shù)的活動對象，依次查找，直到找到為止。
2.如果函數(shù)存在prototype原型對象，則在查找完自身的活動對象后先查找自身的原型對象，再繼續(xù)查找。
3.如果整個作用域鏈上都無法找到，則返回undefined。

在執(zhí)行上下文的作用域鏈中，標識符所在的位置越深，讀寫速度就會越慢。全局變量總是存在于執(zhí)行上下文作用域鏈的最末端，因此在標識符解析的時候，查找全局變量是最慢的。

so

在編寫代碼的時候應(yīng)盡量少使用全局變量，盡可能使用局部變量。
我們經(jīng)常使用局部變量先保存一個多次使用的需要跨作用取的值再使用。

function a() {  
    var i = 1;  
    function b() { 
        console.log(i++); 
    }  
    return b; 
}
var c = a(); 
c();

1.當定義函數(shù)a，js解釋器將函數(shù)a的作用域鏈設(shè)置為定義a時a所在的環(huán)境。
2.執(zhí)行函數(shù)a的時候，a會進入相應(yīng)的執(zhí)行上下文。
3.在創(chuàng)建執(zhí)行上下文的過程中，首先會為a添加一個scope屬性，即a的作用域，其值就為a的作用域鏈。
4.然后執(zhí)行上下文會創(chuàng)建一個活動對象。
5.創(chuàng)建完活動對象后，把活動對象添加到a的作用域鏈的最頂端。此時a的作用域鏈包含了兩個對象：a的活動對象和window對象。
6.接著在活動對象上添加一個arguments屬性，它保存著調(diào)用函數(shù)a時所傳遞的參數(shù)。
7.最后把所有函數(shù)a的形參和內(nèi)部的函數(shù)b的引用也添加到a的活動對象上。    
  在這一步中，完成了函數(shù)b的的定義（如同a），函數(shù)b的作用域鏈被設(shè)置為b所被定義的環(huán)境，即a的作用域。
8.整個函數(shù)a從定義到執(zhí)行的步驟完成。

a返回函數(shù)b的引用給c，因為函數(shù)b的作用域鏈包含了對函數(shù)a的活動對象的引用，也就是說b可以訪問到a中定義的所有變量和函數(shù)。函數(shù)b被c引用，函數(shù)b又依賴函數(shù)a，因此函數(shù)a在返回后不會被GC回收，所以形成了閉包。