JavaScript閉包與房子

1、何謂閉包

JavaScript例子:

function GISMapPanel() {
   this.mapPanel = document.getElementById("mapDiv"); 
   this.width; 
   this.height;

   this.showMap = function() {
      alert(this.mapPanel); //tip:[object]
      this.mapPanel.onmousedown = this.mouseDownEventProcess();
   }
  
   this.mouseDownEventProcess = function( ){ 
      var _this = this;
      return function() {
          alert(this.mapPanel); //tip:undefined,why;
          _this.width = 400;
          _this.height = 300;
          //other codes
      }
   }
}

閉包簡單的解釋是,ECMAScript允許inner functions(嵌套函數):函數可以定義在另外一個函數裏面。這些內部的函數可以訪問outer function(父函數)的local變量,參數,其它內部函數。當內部函數被構造,並可以在函數外被獲得(函數當成返回值),這個內部函數在 outer function返回後被執行(在outer函數外執行),那一個閉包形成了。

閉包特徵:A、作爲一個函數變量的一個引用,當函數返回時,其處於激活狀態;B、一個閉包就是當一個函數返回時,一個沒有釋放資源的棧區。

2、 閉包隱喻

function就像房子內的居室(也是房子),可以租給給甲居住,甲就是居室(function)的主人(this),也可以租給乙住,乙就成爲居室(function)的主人(this),甲原來的一切則被甲帶走,乙用不到任何甲的東西。如果甲是房子(外層function)的主人,並把某居室(內層function)租給乙,乙具有居室內的一切,而乙也可以使用甲的衛生間、客廳(外層函數變量,如_this)。閉包變量就是外層房子內變量,包括居室(function)、衛生間、客廳(外層函數變量)。同JavaScript閉包,居室可以是一局、兩局、多局,當然一局一般比較好租,JavaScript閉包一般也是一局。

3、閉包作用

面向對象編程的成功和流行,使不支持面向的對象編程的語言也儘量往這個方向靠,如C語言可以通過struct及function指針,模擬面向對象編程,以期達到面向對象的封裝、多態;JavaScript則通過基於對象編制以期達到封裝性。如上例所示,把地圖(div)相關的事件處理代碼、相關屬性、相關方法集中到GISMapPanel對象中。但由於事件發生的實體是地圖對應的div對象,事件函數調用時房子是由div對象居住的,也就是說this是div元素,因此,會出現alert(this.mapPanel); //tip:undefined,div元素沒有屬性mapPanel;如果想要訪問原GISMapPanel對象中的屬性,就要象例子所示,把GISMapPanel對象當作一個客廳來處理,從而可以使用客廳內的東西,而不是別人居室內的東西(也是訪問不到的,正如alert(this.mapPanel); //tip:undefined,該this就不是外層居室的this了,本來想直接訪問外層居室的this)。通過閉包、基於對象,取代了全局變量、函數方式的JavaScript處理事件、業務邏輯處理手段,增加了模塊性、封裝性、問題局部化等特性。

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章