readyState的五种状态详解

原创

mb61b9b1fc10447 2011-03-07 14:03:00 ©著作权

文章标签 xml 数据初始化 文章分类 代码人生

©著作权归作者所有：来自51CTO博客作者mb61b9b1fc10447的原创作品，请联系作者获取转载授权，否则将追究法律责任

在《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 (未初始化)： (XMLHttpRequest)对象已经创建，但还没有调用open()方法。

1 (载入)：已经调用open() 方法，但尚未发送请求。

2 (载入完成)：请求已经发送完成。

3 (交互)：可以接收到部分响应数据。

4 (完成)：已经接收到了全部数据，并且连接已经关闭。

在《Understanding AJAX: Using JavaScript to Create Rich Internet Applications 》中，则用下表进行了说明：

根据以上几本书中的关于readyState五种状态的介绍，我认为还是《Pragmatic Ajax A Web 2.0 Primer 》比较到位，因为它提到了对接收到的数据的解析问题，其他书中都没有提到这一点，而这一点正是“(3)交互”阶段作为一个必要的转换过程存在于“(2)载入完成”到“(4)完成”之间的理由，也就是其任务是什么。归结起来，我觉得比较理想的解释方法应该以“状态：任务（目标）+过程+表现（或特征）”表达模式来对这几个状态进行定义比较准确，而且让人容易理解。现试总结如下：

概而括之，整个XMLHttpRequest对象的生命周期应该包含如下阶段：

创建－初始化请求－发送请求－接收数据－解析数据－完成

在具体应用中，明确了readyState的五个状态（XMLHttpRequest对象的生命周期各个阶段）的含义，就可以消除对Ajax核心的神秘感（语焉不详的背后要么是故弄玄虚，制造神秘感；要么就是“以其昏昏，使人昭昭”），迅速把握其实质，对减少学习中的挫折感和增强自信心都极其有益。

比如，通过如下示例：

//声明数组
var states ＝ [“正在初始化……”,
      “正在初始化请求……成功！
正在发送请求……”,
      “成功！
正在接收数据……”,
      “完成！
正在解析数据……”,
      “完成！
”];             
//回调函数内部代码片段
if (xmlHttp.readyState==4)
{
   var span = document.createElement(“span”);
   span.innerHTML = states[xmlHttp.readyState];
   document.body.appendChild(span);             
   if (xmlHttp.status == 200)
   {
     var xmldoc = xmlHttp.responseXML;
     //其他代码
   }             
    //别忘记销毁，防止内存泄漏
    xmlHttp = null;
}else{
   var span = document.createElement(“span”);
   span.innerHTML = states[xmlHttp.readyState];
   document.body.appendChild(span);
}