由prototype_1.3.1進入javascript殿堂-類的初探

來源:互聯網
上載者:User

還是決定冠上ajax的頭銜,畢竟很多人會用這個關鍵詞搜尋。雖然我認為這隻是個炒作的概念,不過不得不承認ajax叫起來要方便多了。ajax的意思我就不詳細解釋了。

寫這個教程的起因很簡單:經過一段時間的ajax學習,有一些體會,並且越發認識到ajax技術的強大,所以決定記錄下來,順便也是對自己思路的整理。

前幾年,javascript在一般人眼裡,功能還很狹窄,所能做的要麼是一些簡單的表單驗證,要麼是許多華而不實的網頁特效。隨著flash的出現,大家已經不像以前那樣熱衷於js特效。似乎js能做的事情更加少了。但這時候,ajax的概念冒了出來,以gmail為典型代表的ajax應用受到很多人的關注,ajax一下子成為一種很熱門的技術,當javascript和xml,和dom模型結合起來,其所能做的事情常常令人匪夷所思,甚至有些功能已經可以和傳統型程式相當。

好了廢話就不多說了,現在就從一個javascript的開發架構prototype_1.3.1(下面簡稱為prototype)開始。我本來是想先介紹一下javascript的進階應用程式,但怕水平不夠,說的沒有條理,所以就結合prototype來說,順便會提及js的文法使用。
下面是架構最前面的兩段代碼:

var Prototype = {
Version: '1.3.1',
emptyFunction: function() {}
}
var Class = {
create: function() {
return function() {
this.initialize.apply(this, arguments);
}
}
}
首先,讓我們來看下面兩個文法的區別:

var o={};
var f=function(){};

後面一個很容易理解,它等價於function f(){};定義一個函數f。但前面一個就不常見了:這其實是建立一個對象,在{}中可以指定對象的成員,比如上面的Prototype,就是一個對象,有兩個成員,第一個是版本號碼,第二個是一個空方法(函數)。像這種不用定義類,就能直接建立對象的功能可能只有js能做到。後面一種文法其實還有一個功能,就是定義一個類f。如果你在函數體中用了this,那麼this後面的變數就是類的成員。
不僅this可以定義類成員,還有一種文法:

function c(){
member1:value,
member2:function(){}
}

這等價於:

function c(){
this.member1=value;
this.member2=function(){};
}

需要注意的是,用前一種辦法時,最後一個成員的最後不能加逗號,我想這種文法應該和數組有關。

在js裡,函數和類是沒有區別的,都可以new,new的作用是把函數體的語句都執行一遍,然後返回一個對象。如果函數裡有this,那麼this後面的變數會作為對象成員;如果沒有,那麼new的作用只是返回一個沒有任何成員的Null 物件。所以你用typeof查看一個所謂類的類型時,仍然會返回function。在js裡也基本沒有類型的概念,所有變數的聲明都用var,即使是函數,也是如此。函數,其實也只是一個變數。

說函數是變數,可能很多人不解。但是你試試下面的做法:

function fTest(){
var a=1;
alert(a);
}
alert(fTest);

你會發現顯示的是fTest這個函數的函數體,所以我們可以認為,所謂函數,僅僅是js引擎可以解析的一段代碼字串。函數名變數儲存的只是這個字串。說的更準確一點,函數名是一個指標變數,它儲存的是這個代碼字串在記憶體中的位置。這樣就不難理解將函數作為參數傳遞,可以作為值返回了,這是以後會大量使用的技術。因為類也是函數,所以理解了函數,也就理解了類。

雖然在js裡函數和類沒有區別,但是類的概念卻可以方便我們進行程式設計,於是prototype很有創意的建立了一個全域對象Class:

var Class = {
create: function() {
return function() {
this.initialize.apply(this, arguments);
}
}
}

Class是一個全域對象,它的唯一方法就是create,作用返回一個函數,前面已經講過函數作為傳回值的機制,這裡不再遨述。返回的函數包括一條語句:

this.initialize.apply(this, arguments);

前面講過,new一個函數時,會執行函數裡的代碼,最後返回對象。所以當使用Class.create()建立了一個函數,再new這個返回的函數時,首先會執行這條語句。後面可以看到,這其實是為了調用類的建構函式。

就是這樣,Class成為了整個prototype的類型建立模型,並且能很好的把類和函數在代碼上區分開來。Class.create()僅僅是返回一個空類,而且它會預設為這個類是具有initialize方法的,所以要使用這個類,至少需要有一個建構函式,這就需要使用到類的繼承。類只是一個函數,那麼函數怎麼繼承呢?看起來匪夷所思,javascript能做到這一點,prototype使得實現更為優雅,至於它是怎麼做到的,且聽下回分解。

相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在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.