爲了進一步抽象我們的AJAX請求並有助於我們以後在不同的應用程序間共享AJAX引擎代碼，創建一個AJAX引擎。爲了使用這個引擎，我們簡單地導入三個JavaScript文件並且向一個名爲AjaxUpdater的對象發出請求。然後，由該引擎來負責處理其它任務，包括把響應代理到在該請求中指定的回調方法中。下面的示例展示了我們如何使用這個引擎發出請求以及導入相關的文件：
＜script type="text/javascript"src="javascript/model/Ajax.js"＞＜/script＞
＜script type="text/javascript" src="javascript/model/HTTP.js"＞＜/script＞
＜script type="text/javascript" src="javascript/model/AjaxUpdater.js"＞＜/script＞
＜script type="text/javascript"＞
document.load = AjaxUpdater.Update(’GET’， URL， callback);
＜/script＞
JavaScript以前經常被誤解，似乎它主要用於實現客戶瀏覽器端圖形效果。其實，JavaScript是一種強有力的語言，特別當它與AJAX以及一個應用程序的服務器端相結合時；但是，即使在客戶端，JavaScript也能夠實現遠比你預料得多的多的功能。面向對象的JavaScript就是一個示例，它能夠使我們創建對象，擴展內在對象，甚至能夠把我們的對象創建成包以達到更容易的管理之目的。
在本文示例中，我們將創建三個對象：Auto，Car和Wheel。其中，每一個都是簡單的對象；在此，我們僅使用它們來展示如何創建一個基本包。
首先，Auto對象被聲明爲一個新的對象：
var Auto = new Object();
Auto.Car = new Object();
Auto.Car.color = "#fff";
Auto.Car.setColor = function(_color)
{
Auto.Car.color = _color;
}
Auto.Car.setColor("#333");
下一個對象，Wheel，是Car的一個子對象：
Auto.Car.Wheel = new Object();
Auto.Car.Wheel.color = "#000";
下面，讓我們來分析一下爲什麼這些對象如此重要以及我們是如何使用它們提供的簡單的屬性的。
把JavaScript對象串行化爲JSON
藉助於JSON分析器，我們可以很容易地把剛纔創建的JavaScript對象串行化爲JSON。首先，我們需要下載該分析器的一個副本，並且要把它添加到文檔中。下面是我在本文示例中用於導入該腳本的相應的代碼：
＜script type="text/javascript" src="javascript/utils/jsonparser.js"＞＜/script＞
我已經把該分析器添加到我的javascript目錄，即一個稱爲utils的子目錄下。
下面是最終的包括到其中用於導入適當的JavaScript文件的代碼片斷：
＜script type="text/javascript" src="javascript/Auto.js"＞＜/script＞
＜script type="text/javascript" src="javascript/Car.js"＞＜/script＞
＜script type="text/javascript" src="javascript/Wheel.js"＞＜/script＞
＜script type="text/javascript" src="javascript/utils/jsonparser.js"＞＜/script＞
＜script type="text/javascript" src="javascript/model/Ajax.js"＞＜/script＞
＜script type="text/javascript" src="javascript/model/HTTP.js"＞＜/script＞
＜script type="text/javascript" src="javascript/model/AjaxUpdater.js"＞＜/script＞
在導入適當的文件後，我們可以通過把兩個div元素和一個onload事件簡單地添加到HTML文檔中開始串行化。這兩個div元素將分別擁有ID：body和loading。其中，這個loading標籤將由AJAX引擎使用來指示進度情況，而body標籤將用於顯示消息。
＜div id="loading"＞＜/div＞
＜div id="body"＞＜/div＞
onload事件相應於body元素並且設置它的innerHTML屬性爲JavaScript對象（作爲一個串行化的JSON字符串）。爲了實現這一目的，我在Auto對象上使用了jsonparser.js文件內的toJSONString方法：
＜body onload="document.getElementById(’body’).innerHTML = ’＜b＞Local objects serialized as JSON＜/b＞＜br/＞Auto Object: ’ Auto.toJSONString();"＞
你可能還記得，在前面我們曾調用了一個稱爲setColor的方法來改變Car對象的顏色。當時，我使用它是因爲我想向你展示串行化能夠在運行時刻的任何點上實現，而且還爲了反映出對象中最新的數據。
如果你仔細分析一下onload事件，你會注意到，Car和Wheel對象都包裝在方括號內，這些方括號代表了父對象（即Auto）。這意味着，該串行化的JavaScript對象能夠在運行時刻被髮送到服務器端以存儲最新的數據，並且也可以在應用程序啓動時從服務器端進行接收以便從數據庫中檢索多數的當前數據。最精彩的部分在於，爲了創建一種“無縫”的過程，所有與服務器之間實現的數據交換都可以使用JSON技術來實現。
下面，讓我們來看一下相同的數據是如何從服務器端接收的，以及它們是如何被使用最新的數據（典型地，來源於一個數據庫）串行化爲客戶端JavaScript對象的。
把JSON反串行化爲客戶端JavaScript對象
在本文中，我簡單地把一個靜態文件創建爲JSON響應，但是在實際開發中，你可以把這些數據存儲在一個數據庫中並且使用一種服務器端語言返回它。基於這一能力，我們就可以輕鬆地創建一種強有力的數據交換過程！在前面，我們已經分析了這一串行化過程。憑基本的AJAX體驗，你應該能夠理解數據是如何被寄送到服務器端的。現在，讓我們着手討論反串行化的問題。首先來看一個針對本文示例提供的靜態JSON文件。這個文件其實是我們在上一節中串行化的數據：
{"Car":{"color":"#333"，"Wheel":{"color":"#000"}}}
作爲一個請求JSON文件的示例，當我們點擊下列鏈接時將請求這個串行化的Auto對象：
＜a href="javascript:AjaxUpdater.Update(’GET’， ’json/data.js’， displayResponse);"＞Get remote JSON＜/a＞
一旦接收到響應消息，我們的稱爲displayResponse回調方法就會被激活，然後，我們就能夠反串行化並開始使用這些對象：
＜script type="text/javascript"＞
function displayResponse()
{
if(Ajax.checkReadyState(’loading’) == "OK")
{
var Auto = Ajax.request.responseText.parseJSON();
document.getElementById("body").innerHTML = "＜br/＞＜b＞Remote JSON unserialized＜/b＞";
document.getElementById("body").innerHTML = "＜br/＞Car color: " Auto.Car.color;
document.getElementById("body").innerHTML = "＜br/＞Wheel color: " Auto.Car.Wheel.color;
}
}
＜/script＞
一旦我們擁有了該responseText，我們就能夠簡單地使用JSON分析器中的parseJSON方法來從串行化的數據中重建我們的Auto對象。藉助於這個新的Auto對象，我們就可以調用相應的子對象。這個特徵允許我們在服務器和客戶端來回發送對象—而不必進行大量的分析工作，然而在以前標準的XML響應情況下我們將卻必須這樣做。這樣以來，我們就可以創建出能夠基於AJAX技術來保留自身狀態的客戶端JavaScript對象。