javascript,jquery(閉包概念)

來源:互聯網
上載者:User

偶爾聽人說javascript閉包,讓我聯想起以前學編譯原理和數字邏輯裡講的閉包,以前上課講的閉包很難懂,而且含有遞迴的意思在裡面,現在不想再查看裡面的閉包概念。

但javascript我是經常要用,所以是要懂這裡面的概念。

其實javascript裡的閉包概念很簡單,就是函數用到外部變數,不需要傳參就可以擷取。

舉個例子:

 

<script>

 

var sMessage = "Hello world";   
  
function sayHello(){   
     alert(sMessage);   
}   
  
sayHello();  

addNumber(1,2);

 

var iBaseNum = 10;   
  
function addNumber(iNum1, iNum2) {   
    function doAddition() {   
        alert(iNum1 + iNum2 + iBaseNum);   
    }   
    return doAddition();   

 

function a(){
 var i=0;
 function b(){
 alert(++i);
 }
 return b;
}

var c = a();
c();
c();

</script>
第一個函數sayHello沒有傳參數,直接利用了sMessage變數,這個就叫做閉包。

第二個函數複雜點,裡面有個doAddition也是閉包函數,他不需要參數,直接在執行環境中擷取iNum1,iNum2,還有外部變數 iBaseNum。

 第三個函數 是能保護 i變數的訪問,並且一直儲存i在記憶體中,可以一直增加。(閉包的一個經典用法)

jquery中閉包也差不多,先給個例子

 

你也許會問(function($){
     $("div p").click(function(){alert("cssrain!")});
})(jQuery);            //一個閉包
這是什麼寫法啊?

別急,我也是請教了upc ,才稍微懂了點。

這裡面的$只是形參,但jquery是全域變數,所以不需要調用該函數就會自動執行,或者分兩步

就是轉化成正常的函數,先寫函數,後調用。

如下所示
其實:
(function($){
     $("div p").click(。。。);
})(jQuery);   
就是等於
function tempFunction($){  //建立一個以$為形參的函數
     $("div p").click(....);
}
TempFunction(jQuery);         //傳入實參jQuery執行函數.

乾脆直接這麼寫 ,算了

 

(function(cssrain){
     cssrain("div p").click(.... );
})(jQuery);            //一個閉包

 

閉包的基本寫法:
(function(){do someting})();
//這個你就理解為定義一個匿名函數並立即執行
帶參數的話就這樣:
(function(形參){do someting})(實參);
另外
(function(){var upc="i am upc"})();
alert(upc);
會提示undefined。
因為閉包後,裡面的變數就相當於局部了。

閉包的好處:
不增加額外的全域變數,
執行過程中所有變數都是在匿名函數內部。

上面的例子不是很好,跟javascript的閉包有點混淆,但這確實也是jquery中的一種閉包。只不過經過jquery的加工罷了。

如過有什麼不對,大家互相討論,我也是初學者,還有很多不懂得地方。

 

相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.