javascript匿名函式簡單介紹

antzone發表於2017-03-21

函式是javascript中非重要的物件,並且使用非常的靈活,下面就介紹一下匿名函式的概念和作用。

故名思議,匿名函式就是沒有名稱的函式。

一.函式的宣告:

在介紹匿名函式之前先介紹一下幾種函式的宣告方式。

1.函式宣告方式:

[JavaScript] 純文字檢視 複製程式碼
function func(x,y){
  return x+y;
}

2.表示式方式:

[JavaScript] 純文字檢視 複製程式碼
var func=function(x,y){
  return x+y;
}

在表示式方式中,等號右邊其實就是一個匿名函式,建立完函式物件之後,就會將該物件的引用賦值給變數func。

二.匿名函式的簡單使用:

[JavaScript] 純文字檢視 複製程式碼
(function(x,y){
  return x+y;
})(1,2)

前面括號中宣告瞭一個匿名函式,之所以要外面要套一個括號(分組運算子),目的是將function(){}作為一個函式直接量,如果沒有分組運算子的話,function(){}將會被人作為函式宣告,但是函式宣告需要有function+函式名(){}組成。最後使用()呼叫函式即可。

三.匿名函式在閉包中使用:

關於閉包的概念這裡就不多介紹了,具體可以參閱javascript閉包概念簡單解析一章節。 

例項一:

[JavaScript] 純文字檢視 複製程式碼
function func(){
  var str="螞蟻部落";
  setTimeout(function(){alert(str);},5000);
}
func();

上面是一個非常簡單的程式碼,但是確實一個閉包的應用。func()函式能夠在很短的時間內執行完畢,但是區域性變數str並沒有被銷燬,這是因為定時器函式還有使用,需要再在5秒之後才銷燬。在上面程式碼中,定時器函式中就是匿名函式的應用。

再看看一個關於閉包的程式碼:

[JavaScript] 純文字檢視 複製程式碼
function func(x,y){ 
  return x+y; 
}
function delay(x,y,time){
  setTimeout(func('+ x+','+y+')',time);  
}

以上程式碼是為了給定時器函式所引用的函式func傳遞引數,但是這種形式的可讀性很差,程式碼修改如下:

[JavaScript] 純文字檢視 複製程式碼
function func(x,y){ 
  return x+y; 
}
function delay(x,y,time){
  setTimeout(function(){
    func(x,y) 
  },time);   
}

例項二:

關於javascript名稱空間可以參閱javascript名稱空間簡單介紹一章節。

名稱空間可以減少全域性變數的使用,在大專案中使用非常有效,程式碼如下:

[JavaScript] 純文字檢視 複製程式碼
var namespace={};
(function(){ 
  var addEvent=function(){ 
    //code
  };
  function removeEvent(){}
  namespace.addEvent=addEvent;
  namespace.removeEvent=removeEvent;
})();

在以上程式碼中,addEvent和removeEvent都是區域性變數,不過可以通過全域性變數namespace進行引用,這就大家減少了全域性變數的使用,也就大家減少了變數衝突的可能性。

相關文章