javascript中閉包有什么作用

本篇內容介紹了“javascript中閉包有什么作用”的有關知識，在實際案例的操作過程中，不少人都會遇到這樣的困境，接下來就讓小編帶領大家學習一下如何處理這些情況吧！希望大家仔細閱讀，能夠學有所成！

什么是閉包？

閉包有哪些作用？

其實我們在學習javascript的時候閉包無處不在，你只需要能夠識別并接受它。閉包并不是一個需要學習的新的語法或者模式才能使用的工具，閉包是基于詞法作用域書寫代碼時所產生的自然結果。我們幾乎不用在編寫代碼時刻意去創建閉包。

相信此時已經有不少小伙伴心里在嘀咕，這詞法作用域有是個啥，不用慌，且聽我緩緩道來，簡而言之，詞法作用域就是定義在詞法階段的作用域。換句話說，詞法作用域是由你在寫代碼時將變量和塊級作用域寫在哪里決定的，因此當詞法分析處理器處理代碼時會保持作用域不變（大部分情況是這樣的）。

function test(){
   var arr = []
   for(var i=0;i<10;i++){
       arr[i]=function(){
           console.log(i);
       }
   }
   return arr
}

var myArr = test()
// myArr[0]()
// myArr[1]()
// ...

for(var j = 0; j < 10; j++){ 
   myArr[j]()
}
//為了避免繁瑣此處使用了第二個循環來調用test函數里第一個循環里函數的打印出十個結果

我們先來分析一下這段代碼： 當這段代碼執行時，按照常理分析應該是依次打印出0~9，十個數字；但是for循環運行時不需要時間（以微秒計算忽略不計），當函數test，return arr時，arr[]里面是10個function(){console.log(i);}，此時數組里的函數沒有執行，當var myArr = test()調用test函數時，由于for循環執行的時間忽略不計，所以此時i已經是10，所以打印出的是10個10。

相信此時就會有人問，這與我們要講的閉包又有什么關系呢，那如果我們把這段代碼稍微修改一下，改變成一個累加器，要如何實現他呢？

相信此時會有大佬表示那還不簡單嗎？

把var定義改成let定義，使得第一個for循環成為一個塊級作用域，那么就可以變成累加器了。當然是沒有問題的，

但是我們今天講的是在ES5的時候如何實現累加器。那我們再看看下面這段代碼：

function test(){
    var arr = []
    for(var i=0;i<10;i++){
        (function(j){
            arr[j]=function(){
                console.log(j);
            }
        })(i)
    }
    return arr
}

var myArr = test()

for(var j = 0; j < 10; j++){ 
    myArr[j]()
}

細心地朋友肯定會發現，這不就是把在循環里面的函數體改成一個自執行函數嘛，但是此時輸出的結果就是 從0~9依次輸出十個數字，而這里面就包含了閉包，當我們開始執行這段代碼的時候第二個for循環會調用十次，當每個自執行函數執行時會創建一個自執行函數的AO對象，這個自執行函數的AO對象里就存在一個屬性名為j，照常理而言自執行函數執行完畢之后，它的AO對象就應該被銷毀了，但是當myarr[j] ()執行時，現在作用域鏈頂端的arr[j]的AO對象里找屬性名j，但是沒有找到，順著作用域鏈往下找，在自執行函數的AO對象里找到了，所以當自執行函數結束時，它的AO對象并不會被垃圾回收機制回收，否則當myarr[j] ()執行時就會報錯，此時就形成了閉包。

當一個函數被保存到了外部，將會產生閉包

我們再來舉個例子

function a(){
    function b(){
        var bbb = 234
        console.log(aaa);
    }
    var aaa = 123
    return b // b出生在a里面，但是被保存出去了
}

var glob = 100
var demo = a()
demo()

這段代碼我們先用預編譯來分析，首先是定義一個全局的GO對象，在找全局的聲明找全局變量聲明，將將變量聲明作為 GO 的屬性名，值為undefined，在全局找函數聲明，將函數名作為 GO 對象的屬性名，值賦予函數體。此時應該為GO{ glob: undefined--->100 ; demo: undefined ; a: fa(){}  }; 再對函數a創建一個AO{ aaa：undefined--->123;b: fb(){}  },最后再對函數a里面的函數b進行預編譯創建一個b的AO{ b: undefined--->234};此時作用域鏈的順序為1. 函數b的AO對象；2. 函數a的AO對象；3. 全局GO對象。當我們打印函數b里面的aaa時，先從作用域鏈的頂端開始找，在函數b的AO對象里沒有aaa，那就會順著作用域鏈往下找，找到第二層函數a的AO對象是找到了aaa的值為123，輸出結果。

如果我們沒有從預編譯的角度去分析就會認為此時的aaa應該會報錯的，當var demo = a()執行時，當a函數執行結束，那么a對應的AO對象應該被銷毀了，照常理分析當我們執行demo時作用域鏈此時應該會創建b的AO對象和GO對象，此時只有b的AO對象，沒有a的AO對象，應該不能打印出aaa的值，但是此時aaa的值為123，則說明a的AO對象沒有被銷毀，那么為什么呢？原因就在于這里創建了閉包，當var demo = a()執行結束之后，垃圾回收機制會來問，a函數老兄，我看你都執行完畢了，你的運行內存是不是可以給我釋放了，但是此時a函數只能無奈搖搖頭說道，老哥，我也不確定我有沒有執行完畢，我執行完創建了一個b，但是b又不歸我管，所以我也不確定b有沒有被調用，所以我也不確定我有沒有執行完畢，垃圾回收機制想了想，既然你都不知道那我就不回收了，要是回收了還沒執行完的就該報錯了，所以此時a的AO對象就沒有被回收。

補充全面一點就是：當一個函數內部的函數被保存到函數外部時，就會產生閉包。

相信通過這兩個例子，你已經對閉包有了一個大概的了解，那接下來我們說一下閉包有哪些作用。

閉包的作用

• 
  

1. 實現公有變量 例如：累加器（3.js）

• 
  

2. 做緩存

• 
  

3. 可以實現封裝，屬性私有化

• 
  

4. 模塊化開發，防止污染全局變量

我們對閉包的作用也來一個例子（3.js）

 var count = 0
 function add() {
   return count++
 }
 console.log(add());
 console.log(add());
 console.log(add());

這是一段比較普通的累加的代碼，但是如果我們在實習甚至是工作的時，公司要求你把累加器封裝成一個模塊化的代碼，那么
此時，為了模塊化我們盡可能避免定義全局變量，但是不定義全局變量我們如何實現呢，此時我們就可以用到閉包了；

function add() {
    var count = 0
    function a() {
      ++count
      console.log(count);
    }
    return a
  }
  var res = add()
  res()
  res()
  
  //add函數結束之后，add的AO對象沒有被銷毀，因為add函數執行完了之后，返回的a不知道是否被調用就形成了閉包，這樣
  就能使得不使用全局變量也能封裝成一個模塊化的累加器。

“javascript中閉包有什么作用”的內容就介紹到這里了，感謝大家的閱讀。如果想了解更多行業相關的知識可以關注億速云網站，小編將為大家輸出更多高質量的實用文章！