AJAX之旅(1)：由prototype

ajax|javascript

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

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

前幾年，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使得實現更為優雅，至於它是怎麼做到的，且聽下回分解。