使用回调函数监视请求

处理异步通信的第二个部分是在代码中设置一个入口点，以便在调用结束的时候可以获取结果。这通常是通过分配一个回调函数来实现的，也就是说，在未来 的某个不确定时刻，当结果返回的时候，将会执行这一段代码。我们在代码清单2-9中看到的window.onload函数就是一个回调函数。

　　回调函数非常适合用于大多数现代UI工具箱中的事件驱动的编程方法。按下键盘、点击鼠标等等，这些事件都将会在未来某个无法预测的时刻发生，程序员预见到了这一点，并且为这些事件写好了处理函数。在用javaScript编写用户界面的事件处理代码时，我们将函数分配给onkeypress、onmouseover或者对象上的类似属性。在为服务器请求的回调函数编写代码时，我们见到过称作onload和onreadystatechange的类似属性。

　　IE和Mozilla都支持onreadystatechange回调函数，所以我们可以放心地使用(Mozilla还支持onload，这更 加直接一点，但是它不能像onreadystatechange那样给我们所需要的信息)。一个简单的回调处理函数展示在代码清单2-10。

　　代码清单2-10 使用回调处理函数
　　var READY_STATE_UNINITIALIZED=0;
　　var READY_STATE_LOADING=1;
　　var READY_STATE_LOADED=2;
　　var READY_STATE_INTERACTIVE=3;
　　var READY_STATE_COMPLETE=4;
　　var req;
　　function sendRequest(url,params,HttpMethod){
　　　　if (!HttpMethod){
　　　　　　HttpMethod="GET";
　　　　}
　　　　req=getXMLHTTPRequest();
　　　　if (req){
　　　　　　req.onreadystatechange=onReadyStateChange;
　　　　　　req.open(HttpMethod,url,true);
　　　　　　req.setRequestHeader
　　　　　　("Content-Type", "application/x-www-form-urlencoded");
　　　　　　req.send(params);
　　　　}
　　}
　　function onReadyStateChange(){
　　　　var ready=req.readyState;
　　　　var data=null;
　　　　if (ready==READY_STATE_COMPLETE){
　　　　　　data=req.responseText;
　　　　}else{
　　　　　　data="loading...["+ready+"]";
　　　　}
　　　　//... do something with the data...
　　}

　　首先，在发送请求之前，我们修改了sendRequest()函数，告诉请求对象使用哪个回调函数。其次，我们定义了这个处理函数，并且给它取了一个缺乏想象力的名字onReadySt- ateChange()。

　　readyState可以取一系列数值。为了使得代码易于阅读，我们在这里给每一个数值分配了一个有描述性的变量名。目前的代码只对数值4感兴趣，它表明请求已经完成。

　　要注意的是，我们将请求对象声明为一个全局变量。在这里，这有助于事情保持简单，以便更好地理解XMLHttpRequest对象的工作原理。但是，如果我们试图同时发送多个请求，这样就会带来一些麻烦。现在将这些部分整合起来，从头到尾看看如何处理请求。