readyState的五種狀态詳解

在《Pragmatic ajax(動态網站靜态化) A Web 2.0 Primer 》中偶然看到對readyStae狀态的介紹，感覺這個介紹很實在，摘譯如下：

0: (Uninitialized) the send( ) method has not yet been invoked. 

1: (Loading) the send( ) method has been invoked, request in progress. 

2: (Loaded) the send( ) method has completed, entire response received.

3: (Interactive) the response is being parsed. 

4: (Completed) the response has been parsed, is ready for harvesting.

0 － （未初始化）還沒有調用send()方法

1 － （載入）已調用send()方法，正在發送請求

2 － （載入完成）send()方法執行完成，已經接收到全部響應内容

3 － （互動）正在解析響應内容

4 － （完成）響應内容解析完成，可以在用戶端調用了

對于readyState的這五種狀态，其他書中大都語焉不詳。像《Foundations of ajax(動态網站靜态化)》中，隻在書中的表2-2簡單地列舉了狀态的“名稱”－－The state of the request. The five possible values are 0 = uninitialized, 1 = loading, 2 = loaded, 3 = interactive, and 4 = complete。而《ajax(動态網站靜态化) in Action》中好像根本就沒有提到這5種狀态的細節。《Professional ajax(動态網站靜态化)》中雖不盡人意，但還是有可取之處：

There are five possible values for readyState: 

0 (Uninitialized): The object has been created but the open() method hasn’t been called. 

1 (Loading): The open() method has been called but the request hasn’t been sent. 

2 (Loaded): The request has been sent. 

3 (Interactive). A partial response has been received. 

4 (Complete): All data has been received and the connection has been closed.

readyState有五種可能的值：

0 (未初始化)： (xml(标準化越來越近了)HttpRequest)對象已經建立，但還沒有調用open()方法。

1 (載入)：已經調用open() 方法，但尚未發送請求。

2 (載入完成)： 請求已經發送完成。

3 (互動)：可以接收到部分響應資料。

4 (完成)：已經接收到了全部資料，并且連接配接已經關閉。

在《Understanding ajax(動态網站靜态化): Using JavaScript to Create Rich Internet Applications》中，則用下表進行了說明：

readyState Status Code

Status of the xml(标準化越來越近了)HttpRequest Object 

(0) UNINITIALIZED

未初始化 The object has been created but not initialized. (The open method has not been called.)

（xml(标準化越來越近 了)HttpRequest）對象已經建立，但尚未初始化（還沒有調用open方法）。 

(1) LOADING

載入 The object has been created, but the send method has not been called.

（xml(标 準化越來越近了)HttpRequest）對象已經建立，但尚未調用send方法。 

(2) LOADED

載入完成 The send method has been called, but the status and headers are not yet available.

已經調用send方法，（HTTP響應）狀态及頭部還不可用。 

(3) INTERACTIVE

互動 Some data has been received. Calling the responseBody and responseText properties at this state to obtain partial results will return an error, because status and response headers are not fully available.

已經接收部分數 據。但若在此時調用responseBody和responseText屬性擷取部分結果将會産生錯誤，因為狀态和響應頭部還不完全可用。 

(4) COMPLETED

完成 All the data has been received, and the complete data is available in the responseBody and responseText properties.

已經接收到了全 部資料，并且在responseBody和responseText屬性中可以提取到完整的資料。

根據以上幾本書中的關于readyState五種狀态的介紹，我認為還是《Pragmatic ajax(動态網站靜态化) A Web 2.0 Primer 》比較到位，因為它提到了對接收到的資料的解析問題，其他書中都沒有提到這一點，而這一點正是“(3)互動”階段作為一個必要的轉換過程存在于“(2)載 入完成”到“(4)完成”之間的理由，也就是其任務是什麼。歸結起來，我覺得比較理想的解釋方法應該以“狀态：任務（目标）+過程+表現（或特征）”表達 模式來對這幾個狀态進行定義比較準确，而且讓人容易了解。現試總結如下：

readyState 狀态

狀态說明

(0)未初始化

此階段确認xml(标準化越來越近了)HttpRequest對象是否建立，并為調用open()方法進行未初始化作好準備。值為0表示對象已經存在，否 則浏覽器會報錯－－對象不存在。

(1)載入

此階段對xml(标準化越來越近了)HttpRequest對象進行初始化，即調用open()方法，根據參數(method,url,true)完成對 象狀态的設定。并調用send()方法開始向服務端發送請求。值為1表示正在向服務端發送請求。

(2)載入完成

此階段接收伺服器端的響應資料。但獲得的還隻是服務端響應的原始資料，并不能直接在用戶端使用。值為2表示已經接收完全部響應資料。并為下一階段對資料解 析作好準備。

(3)互動

此階段解析接收到的伺服器端響應資料。即根據伺服器端響應頭部傳回的MIME類型把資料轉換成能通過responseBody、responseText 或responsexml(标準化越來越近了)屬性存取的格式，為在用戶端調用作好準備。狀态3表示正在解析資料。

(4)完成

此階段确認全部資料都已經解析為用戶端可用的格式，解析已經完成。值為4表示資料解析完畢，可以通過xml(标準化越來越近了)HttpRequest對 象的相應屬性取得資料。

概而括之，整個xml(标準化越來越近了)HttpRequest對象的生命周期應該包含如下階段：

建立－初始化請求－發送請求－接收資料 －解析資料－完成

在具體應用中，明确了readyState的五個狀态（xml(标準化越來越近了)HttpRequest對象的生命周期各個階段）的含義，就可以 消除對ajax(動态網站靜态化)核心的神秘感（語焉不詳的背後要麼是故弄玄虛，制造神秘感；要麼就是“以其昏昏，使人昭昭”），迅速把握其實質，對減少 學習中的挫折感和增強自信心都極其有益。

比如，通過如下示例：

//聲明數組

var states ＝ [“正在初始化……”,

      “正在初始化請求……成功！

正在發 送請求……”,

      “成功！

正在接收資料……”,

      “完成！

正在解析資料……”,

”];            

//回調函數内部代碼片段

if (xml(标準化越來越近了)Http.readyState==4)

{

   var span = document.createElement(“span”);

   span.innerHTML = states[xml(标準化越來越近了)Http.readyState];

   document.body.appendChild(span);            

   if (xml(标準化越來越近了)Http.status == 200)

   {

     var xml(标準化越來越近了)doc = xml(标準化越來越近了)Http.responsexml(标準化越來越近了);

     //其他代碼

   }            

    //别忘記銷毀，防止記憶體洩漏

    xml(标準化越來越近了)Http = null;

}else{

   document.body.appendChild(span);

}結果如下：

正在初始化請求……成功！

正在發送請求……成功！

正在接收資料……完成！

正在解析資料……完成！

我們很容易明白xml(标準化越來越近了)HttpRequest對象在各個階段都在做什麼。是以，也就很容易對ajax(動态網站靜态化)的核心 部分有一個真正簡單明了的了解。