javascript的匿名函數的理解(轉載學習)


最近在學習js,碰到匿名函數,在網上查找了一些資料,準備日後學完DOM和JQuery再回頭仔細理解

代碼如下:

(function(){ 
//這裏忽略jQuery所有實現 
})(); 
(function(){ //這裏忽略jQuery所有實現 })(); 

  

  要說匿名函數,我們首先要由函數本身說起。函數的定義如下:

函數是將唯一的輸出值賦予給每一輸入的“法則”。

  當然,這只是數學上的定義。但是,在計算機編程語言中,函數的定義也八九不離十。因爲,我們都知道,計算機中的函數,也類似數學定義中的描述,它是將輸入的若干數據,經過代碼設定的邏輯操作處理後,返回唯一的輸出的一組代碼組合塊。——當然,特例是,輸入的數據爲空或輸出的數據爲空,或者兩者都爲空。

  下面,我們先初步瞭解一下和匿名函數相關的概念。

函數聲明(function 語句)
  要使用一個函數,我們就得首先聲明它的存在。而我們最常用的方式就是使用function語句來定義一個函數,如:

代碼如下:

function abc(){ 
// code to process 
} 
function abc(){ // code to process } 
  當然,你的函數也可以是帶參數的,甚至是帶返回值的。 

view plaincopy to clipboardprint? 
function abc(x,y){ 
return x+y; 
} 
function abc(x,y){ return x+y; } 

 

  但是,無論你怎麼去定義你的函數,JS解釋器都會把它翻譯成一個Function對象。例如,你在定義上面的其中一個例子的函數號,再輸入如下代碼:

alert(typeof abc);// "function" 


  你的瀏覽器就會彈出提示框,提示你abc是一個Function對象。那麼Function對象究竟是什麼呢?

Function 對象
  Function對象是JavaScript裏面的固有對象,所有的函數實際上都是一個Function對象。關於這個方面的討論,我們留到下一個專題節。我們先看看,Function對象能不能直接運用構造函數創建一個新的函數呢?答案是肯定的。例如:

代碼如下:

var abc = new Function("x","y","return x*y;"); 
alert(abc(2,3)); // "6" 
var abc = new Function("x","y","return x*y;"); alert(abc(2,3)); // "6" 

 

  相信大家現在對如何聲明一個函數應該是有所瞭解了。那麼什麼纔是匿名函數呢?

聲明匿名函數
  顧名思義,匿名函數就是沒有實際名字的函數。例如,我們把上面的例子中,函數的名字去掉,再判斷一下他是不是一個函數:

複製代碼 代碼如下:

alert(typeof function(){});// "function" 
alert(typeof function(x,y){return x+y;});// "function" 
alert(typeof new Function("x","y","return x*y;"))// "function" 
alert(typeof function(){});// "function" alert(typeof function(x,y){return x+y;});// "function" alert(typeof new Function("x","y","return x*y;"))// "function" 


  我們可以很容易地看到,它們全都是Function對象,換言之,他們都是函數,但是他們都有一個特點——沒有名字。所以我們把他們稱作“匿名函數”。然而,正因爲他們沒有“名字”,我們也沒有辦法找到他們。這就引申瞭如何去調用一個匿名函數的問題了。

匿名函數的調用
  要調用一個函數,我們必須要有方法定位它,引用它。所以,我們會需要幫它找一個名字。例如:
複製代碼 代碼如下:

var abc=function(x,y){ 
return x+y; 
} 
alert(abc(2,3)); // "5" 
var abc=function(x,y){ return x+y; } alert(abc(2,3)); // "5" 


  上面的操作其實就等於換個方式去定義函數,這種用法是我們比較頻繁遇到的。例如我們在設定一個DOM元素事件處理函數的時候,我們通常都不會爲他們定名字,而是賦予它的對應事件引用一個匿名函數。

  對匿名函數的調用其實還有一種做法,也就是我們看到的jQuery片段——使用()將匿名函數括起來,然後後面再加一對小括號(包含參數列表)。我們再看一下以下例子:

複製代碼 代碼如下:

alert((function(x,y){return x+y;})(2,3));// "5" 
alert((new Function("x","y","return x*y;"))(2,3));// "6" 
alert((function(x,y){return x+y;})(2,3));// "5" alert((new Function("x","y","return x*y;"))(2,3));// "6" 


  很多人或許會奇怪,爲什麼這種方法能成功調用呢?覺得這個應用奇怪的人就看一下我以下這段解釋吧。

  大家知道小括號的作用嗎?小括號能把我們的表達式組合分塊,並且每一塊,也就是每一對小括號,都有一個返回值。這個返回值實際上也就是小括號中表達式的返回值。所以,當我們用一對小括號把匿名函數括起來的時候,實際上小括號對返回的,就是一個匿名函數的Function對象。因此,小括號對加上匿名函數就如同有名字的函數般被我們取得它的引用位置了。所以如果在這個引用變量後面再加上參數列表,就會實現普通函數的調用形式。

  不知道以上的文字表述大家能不能看明白,如果還是理解不了的話,再看一下以下的代碼試試吧。
複製代碼 代碼如下:

var abc=function(x,y){return x+y;};// 把匿名函數對象賦給abc 
// abc的constructor就和匿名函數的constructor一樣了。也就是說,兩個函數的實現是一樣的。 
alert((abc).constructor==(function(x,y){return x+y;}).constructor); 
var abc=function(x,y){return x+y;};// 把匿名函數對象賦給abc // abc的constructor就和匿名函數的constructor一樣了。也就是說,兩個函數的實現是一樣的。 alert((abc).constructor==(function(x,y){return x+y;}).constructor); 


  PS:constructor是指創建對象的函數。也就是函數對象所代表的函數體。

  總之,將其(被小括號包含的匿名函數)理解爲括號表達式返回的函數對象,然後就可以對這個函數對象作正常的參數列表調用了。(前面這裏犯了個錯 誤,只有函數表達式還是不能直接調用函數的,去掉匿名函數括號必須要伴隨將表達式賦值。也就是(function(){alert(1)})()應該是與 a=function(){alert(1)}()等價,不能連a=都去掉。)

閉包
  閉包是什麼?閉包是指某種程序語言中的代碼塊允許一級函數存在並且在一級函數中所定義的自由變量能不被釋放,直到一級函數被釋放前,一級函數外也能應用這些未釋放的自由變量。

  怎樣?看得一頭冒汗吧……沒事,我也是(雖然是我是瞭解的,只是表達能力的問題)。讓我們換個更加簡單的方法說明:閉包,其實是一種語言特性,它是指的是程序設計語言中,允許將函數看作對象,然後能像在對象中的操作搬在函數中定義實例(局部)變量,而這些變量能在函數中保存到函數的實例對象銷燬爲止,其它代碼塊能通過某種方式獲取這些實例(局部)變量的值並進行應用擴展。

  不知道這麼再解釋後會否更加清晰,如果還是不明白,那麼我們再簡化一下:閉包,其實就是指程序語言中能讓代碼調用已運行的函數中所定義的局部變量。

  現在我們看一個例子:
複製代碼 代碼如下:

var abc=function(y){ 
var x=y;// 這個是局部變量 
return function(){ 
alert(x++);// 就是這裏調用了閉包特性中的一級函數局部變量的x,並對它進行操作 
alert(y--);// 引用的參數變量也是自由變量 
}}(5);// 初始化 
abc();// "5" "5" 
abc();// "6" "4" 
abc();// "7" "3" 
alert(x);// 報錯!“x”未定義! 


var abc=function(y){ var x=y;// 這個是局部變量 return function(){ alert(x++);// 就是這裏調用了閉包特性中的一級函數局部變量的x,並對它進行操作 alert(y--);// 引用的參數變量也是自由變量 }}(5);// 初始化 abc();// "5" "5" abc();// "6" "4" abc();// "7" "3" alert(x);// 報錯!“x”未定義!

  看到這裏,你能判斷究竟jQuery的那個代碼片段是否閉包了嗎?

  。是否應用了閉包特性,必須確定該段代碼有沒有 最重要的要素:未銷燬的局部變量。那麼很顯然,沒有任何實現的匿名函數不可能應用了閉包特性。但如果匿名函數裏面有實現呢?那也還得確定它的實現中有沒有 用到那些未銷燬的局部變量。所以如果問你那個開篇中的jQuery代碼片段是應用了JS裏的什麼特性?那麼它只是匿名函數與匿名函數的調用而已。但是,它 隱含了閉包的特性,並且隨時可以實現閉包應用。因爲JS天生就是有這個特性的!

發佈了21 篇原創文章 · 獲贊 3 · 訪問量 5萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章