XHR和Fetch解析

xhr (xmlhttprequest) 和fetch 是前端实现ajax（asynchronous javascript and xml）的两种方法。 ajax是web 技术发展到ria时期很重要的一项技术。通过ajax 可以向服务端发送请求接收服务端响应，在不刷新整个页面的情况下，实现局部内容的更新。

对象提供了在网页加载后与服务器进行通信的方法

xhr 是的内置对象，提供在网页加载后与服务器进行通信的方法，基于事件机制来实现异步。使用xhr来发送http网络请求时，会经历如下生命周期：

xhr提供了一个属性 readystate 来描述其生命周期的状态。 随着生命周期变化，其状态值变化如下：

当xhr实例刚创建时，状态值会为0:uninitialied；

当xhr实例调用当open方法后，状态值会变为 1:open，表示已为http请求设置好方法，url等信息。

当xhr实例调用了sent方法后，状态值会变为2:sent，表示http请求已经发出；

当xhr接收到http的响应头时，状态值会变为3:receiving， 表示请求响应在接收中，客户端只能操作响应头。

当xhr接收到http全部的响应数据时，状态值会变为4:loaded， 表示响应数据已全部接收完；客户端可以操作响应数据。

当xhr示列调用abort 方法后，http请求会终止，状态值会变为0；

xhr 提供了一个事件 onreadystatechange 来监听其生命周期的变化， 当生命周期的状态值发生变化时，该事件会被触发。这个事件是xhr实现异步的关键。 所有依赖请求数据的异步处理都可以放在这个事件函数里执行。可以在该事件函数里使用xhr的生命周期状态值readystate，来判断http请求的进展。

在xhr的生命周期类，提供的属性和方法如下：

属性：

readystate

responsetext

responsexml

status

statustext

方法：

abort()

getallresponseheaders()

getresponseheader(headerprop)

open(method,url,async,username,password)

send(body)

setresquestheader(name, value)