JavaScript中的閉包真心是一個(gè)老生常談的問(wèn)題了，最近面試也是一直問(wèn)到，我自己的表述能力又不能完全支撐起來(lái)，真是抓狂。在回來(lái)的路上，我突然想到了一個(gè)很簡(jiǎn)單的事情，其實(shí)我們?cè)谧鲰?xiàng)目時(shí)候，其實(shí)就經(jīng)常用到閉包的，可是面試問(wèn)的時(shí)候，回答又往往是我們經(jīng)常搜到的答案，唉 不管是應(yīng)付面試 還是真的想學(xué)點(diǎn)東西 ，我也用自己的理解跟大家分享一下，書(shū)面化就避免不了了的。

1.閉包是什么？

紅寶書(shū)中曰：“是指有權(quán)訪問(wèn)另外一個(gè)函數(shù)作用域中的變量的函數(shù)?！?/p>

簡(jiǎn)單的說(shuō)，JavaScript允許使用內(nèi)部函數(shù)---即函數(shù)定義和函數(shù)表達(dá)式位于另一個(gè)函數(shù)的函數(shù)體內(nèi)。而且，這些內(nèi)部函數(shù)可以訪問(wèn)它們所在的外部函數(shù)中聲明的所有局部變量、參數(shù)和聲明的其他內(nèi)部函數(shù)。當(dāng)其中一個(gè)這樣的內(nèi)部函數(shù)在包含它們的外部函數(shù)之外被調(diào)用時(shí)，就會(huì)形成閉包。再通俗的說(shuō)就是“一個(gè)函數(shù)內(nèi)部創(chuàng)建另外一個(gè)函數(shù)，后面這個(gè)函數(shù)可以讀取上面那個(gè)函數(shù)中的變量，后面這個(gè)函數(shù)就可以稱作‘閉包'”。

2.閉包有啥用？

通過(guò)我大量的查閱，如果說(shuō)“通過(guò)使用閉包，我們可以做很多事情。比如模擬面向?qū)ο蟮拇a風(fēng)格；更優(yōu)雅，更簡(jiǎn)潔的表達(dá)出代碼；在某些方面提升代碼的執(zhí)行效率”，會(huì)不會(huì)感覺(jué)很空洞，那這些會(huì)不會(huì)好一些，由于在JavaScript中沒(méi)有真正的塊級(jí)作用域，但是為了給某個(gè)函數(shù)聲明一些只有該函數(shù)才能使用的局部變量時(shí)，我們就會(huì)用到閉包，這樣我們可以很大程度上減少全局作用域中的變量，凈化全局作用域。

下面舉例說(shuō)明一下：

1.匿名自執(zhí)行函數(shù)

我們知道所有的變量，如果不加上var關(guān)鍵字，則默認(rèn)的會(huì)添加到全局對(duì)象的屬性上去，這樣的臨時(shí)變量加入全局對(duì)象有很多壞處，

比如：別的函數(shù)可能誤用這些變量；造成全局對(duì)象過(guò)于龐大，影響訪問(wèn)速度(因?yàn)樽兞康娜≈凳切枰獜脑玩溕媳闅v的)。

了每次使用變量都是用var關(guān)鍵字外，我們?cè)趯?shí)際情況下經(jīng)常遇到這樣一種情況，即有的函數(shù)只需要執(zhí)行一次，其內(nèi)部變量無(wú)需維護(hù)，

比如UI的初始化，那么我們可以使用閉包：

var data= {  
  table : [],  
  tree : {}  
};  
   
(function(dm){  
  for(var i = 0; i < dm.table.rows; i++){  
    var row = dm.table.rows[i];  
    for(var j = 0; j < row.cells; i++){  
      drawCell(i, j);  
    }  
  }  
    
})(data);

我們創(chuàng)建了一個(gè)匿名的函數(shù)，并立即執(zhí)行它，由于外部無(wú)法引用它內(nèi)部的變量，因此在函數(shù)執(zhí)行完后會(huì)立刻釋放資源，關(guān)鍵是不污染全局對(duì)象。

2.結(jié)果緩存

我們開(kāi)發(fā)中會(huì)碰到很多情況，設(shè)想我們有一個(gè)處理過(guò)程很耗時(shí)的函數(shù)對(duì)象，每次調(diào)用都會(huì)花費(fèi)很長(zhǎng)時(shí)間，那么我們就需要將計(jì)算出來(lái)的值存儲(chǔ)起來(lái)，當(dāng)調(diào)用這個(gè)函數(shù)的時(shí)候，首先在緩存中查找，如果找不到，則進(jìn)行計(jì)算，然后更新緩存并返回值，如果找到了，直接返回查找到的值即可。閉包正是可以做到這一點(diǎn)，因?yàn)樗粫?huì)釋放外部的引用，從而函數(shù)內(nèi)部的值可以得以保留。

var CachedSearchBox = (function(){  
  var cache = {},  
    count = [];  
  return {  
    attachSearchBox : function(dsid){  
      if(dsid in cache){//如果結(jié)果在緩存中  
       return cache[dsid];//直接返回緩存中的對(duì)象  
      }  
      var fsb = new uikit.webctrl.SearchBox(dsid);//新建  
      cache[dsid] = fsb;//更新緩存  
      if(count.length > 100){//保正緩存的大小<=100  
       delete cache[count.shift()];  
      }  
      return fsb;     
    },  
   
    clearSearchBox : function(dsid){  
      if(dsid in cache){  
       cache[dsid].clearSelection();   
      }  
    }  
  };  
})();  
   
CachedSearchBox.attachSearchBox("input");

這樣我們?cè)诘诙握{(diào)用的時(shí)候，就會(huì)從緩存中讀取到該對(duì)象。

3.封裝

var person = function(){  
  //變量作用域?yàn)楹瘮?shù)內(nèi)部，外部無(wú)法訪問(wèn)  
  var name = "default";    
    
  return {  
    getName : function(){  
      return name;  
    },  
    setName : function(newName){  
      name = newName;  
    }  
  }  
}();  
   
print(person.name);//直接訪問(wèn)，結(jié)果為undefined  
print(person.getName());  
person.setName("abruzzi");  
print(person.getName());

4.實(shí)現(xiàn)類和繼承

function Person(){  
  var name = "default";    
    
  return {  
    getName : function(){  
      return name;  
    },  
    setName : function(newName){  
      name = newName;  
    }  
  }  
  };  
 
  var p = new Person();
  p.setName("Tom");
  alert(p.getName());
 
  var Jack = function(){};
  //繼承自Person
  Jack.prototype = new Person();
  //添加私有方法
  Jack.prototype.Say = function(){
    alert("Hello,my name is Jack");
  };
  var j = new Jack();
  j.setName("Jack");
  j.Say();
  alert(j.getName());

寫(xiě)到最后，不知道最后各位親們發(fā)現(xiàn)  自己曾經(jīng)做過(guò)的項(xiàng)目中其實(shí)用到過(guò)很多這種，反正我是遇到了，閉包就是這么一直存在著的。

關(guān)于閉包，雖然老生常談，但是還是挺重要的。至于閉包的缺陷嘛，就說(shuō)一個(gè)好了 不是干貨  濫用閉包 ，會(huì)導(dǎo)致內(nèi)存泄漏，內(nèi)存泄漏是啥 自己百度吧 ^_^。

以上這篇JavaScript中閉包之淺析解讀(必看篇)就是小編分享給大家的全部?jī)?nèi)容了，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。

最新評(píng)論