1. 程式人生 > >JS匿名函式和閉包

JS匿名函式和閉包

一、匿名函式

函式是JavaScript中最靈活的一種物件,這裡只是講解其匿名函式的用途。匿名函式:就是沒有函式名的函式

  • 函式定義常規方式
第一種:這也是最常規的一種

function double(x){
    return 2 * x;   
}
第二種:這種方法使用了Function建構函式,把引數列表和函式體都作為字串,很不方便,不建議使用。(deprecated)

var double = new Function('x', 'return 2 * x;');
第二種:這種方法使用了Function建構函式,把引數列表和函式體都作為字串,很不方便,不建議使用。

var double = new Function('x', 'return 2 * x;');
第三種:

var double = function(x) { return 2* x; }
  • 匿名函式建立
第一種方式:就是上面所講的定義函式,這也是最常用的方式之一。

第二種方式:

(function(x, y){
    alert(x + y);  
})(2, 3);
這裡建立了一個匿名函式(在第一個括號內),第二個括號用於呼叫該匿名函式,並傳入引數。

二、閉包 是函式的巢狀,內層的函式可以使用外層函式的所有變數,即使外層函式已經執行完畢(這點涉及JavaScript作用域鏈)。

function checkClosure(){
    var str = 'rain-man';
    setTimeout(
        function(){ alert(str); } //這是一個匿名函式
    , 2000);
}
checkClosure()這個例子看上去十分的簡單,仔細分析下它的執行過程還是有許多知識點的:checkClosure函式的執行是瞬間的(也許用時只是0.00001毫秒),在checkClosure的函式體內建立了一個變數str,在checkClosure執行完畢之後'''str並沒有被釋放''',這是因為setTimeout內的匿名函式存在這對str的引用。待到2秒後函式體內的匿名函式被執行完畢,'''str才被釋放'''。

利用匿名函式建立閉包

匿名函式最大的用途是建立閉包(這是JavaScript語言的特性之一),並且還可以構建名稱空間,以減少全域性變數的使用。 舉例一

var oEvent = {};
(function(){ 
    var addEvent = function(){ /*程式碼的實現省略了*/ };
    function removeEvent(){}

    oEvent.addEvent = addEvent;
    oEvent.removeEvent = removeEvent;
})();
在這段程式碼中函式addEvent和removeEvent都是區域性變數,但我們可以通過全域性變數oEvent使用它,這就大大減少了全域性變數的使用,增強了網頁的安全性

oEvent.addEvent(document.getElementById('box') , 'click' , function(){});

舉例二

var rainman = (function(x , y){
    return x + y;
})(2 , 3);

舉例三

 var outer=null;
 (function(){
  var one=1;
  function inner(){
   one++;
   alert(one);
 }
})();
outer();    //2
outer();    //3
outer();    //4
這段程式碼中的變數one是一個區域性變數(因為它被定義在一個函式之內),因此外部是不可以訪問的。但是這裡我們建立了inner函式,inner函式是可以訪問變數one的;又將全域性變數outer引用了inner,所以三次呼叫outer會彈出遞增的結果。

弊端:記憶體洩露

使用閉包十分容易造成瀏覽器的記憶體洩露,嚴重情況下會是瀏覽器掛死