原副标题：给阿宝的Java EE手册(5) : AJAX
责任编辑是给阿宝的Java EE存活手册的第5篇， 讲呵呵后端技师必不可少的AJAX的原委。
返回2001年， 彼时的老赵却是小张， 在representing跟著老板娘和云南的两个子公司密切合作，做两个近似于OA(网络化)的工程项目。
彼时小张刚大学毕业，写过许多asp的流程，在小张的觉悟之中， 却是真的如果你透过应用流程向伺服器T7250， 伺服器处置之后， 须要创下整座页面就可以看见伺服器处置的结论。
但有一天我忽然看见工程项目中大牛写的两个页面，那个页面下面是工具栏，尾端是两个树型内部结构，代表者了两个子公司的各个单位。
点选了工具栏之后， 整座页面没创下， 奇妙的是那个职能部门的树型政府机构居然出现了变动！ 换句话说整座页面没创下， 而已页面的局部性出现了创下。
太难以置信了 ！ 我急忙关上那个一般的asp流程， 看一看见底是甚么情形。
原本点了工具栏之后， 继续执行了几段javascript， 当中创建了两个叫的小东西;
var xhr;
if (window.){
xhr=new (); //非IE应用流程
}else{
xhr=new ActiveXObject(“Microsoft.XMLHTTP“); //IE 应用流程
}
//放置两个回调函数： state_change， 当http的状态出现变动时会调用
xhr.onreadystatechange=state_change
xhr.open(“GET”,”http://xxxxxx.xxx/xxx.asp”,true);// true 表示异步调用
xhr.send(); //这是两个耗时的操作
//具体的回调函数定义
function state_change()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200){
xmlRes = xhr.responseXML;
//对xml进行处置，更新职能部门的树型内部结构， 代码略
document.getElementById(deptTree).innerHTML = xxxxxxx
}
}
//其他代码， 略
你可以想象我第一次看见这样的处理时那种震惊的表情。 原本页面可以这么写， javascript 可以这么用！
其实这里体现的思想有两点：
1. 异步调用
异步的意思是说， 调用两个耗时的函数（上例中的xhr.send()） 之后， 不等到它返回，就直接继续执行后续的代码了。
当然在调用它之前会放置两个回调的函数callback（上例中的state_change），等到那个耗时的函数完成之后，再来调用callback 。
为甚么要这么做呢？ 主要是网络操作太耗时了， 你在应用流程中的两个点选可能访问是地球那一边的伺服器， 如果是同步操作， 即等待网络操作完成之后再进行下一步， 就可能阻塞当前线程， 甚至会导致应用流程卡死的情形。
异步调用在编程中是个非常常用的手段， 后来伺服器端的javascript Node.js 几乎全是基于事件的异步调用。
2. 用XML做应用流程端和伺服器端的数据交换
这点毋庸解释， 参见《给阿宝的Java EE手册(3): XML》 ，看一看xml 的作用。
3. 局部性创下
Javascript 取到从伺服器端返回的XML之后， 解析该XML, 然后透过DOM对象只更新整座页面html的一部分，例如更新两个table, 两个div ….
document.getElementById(deptTree).innerHTML = xxxxxxx
异步的JavaScript和XML(Asynchronous Javascript And XML） 就简称AJAX, 你看这些缩写其实没甚么神秘的。
AJAX那个词2005才出现，之前已经出现了大量的“AJAX”Web应用， 我认为当中最著名的就是Google Maps 它
【XML VS JSON】
但在javascript中使用XML有两个问题：
1. XML 要求有开始标签和结束标签， 如<name>liuxin</name> ,name出现了两次， 这在网络传输中其实是一种冗余浪费。
2. javascript 须要解析xml , 然后展示到应用流程中。
第二点尤其不爽， 所以就有人发展了两个叫JSON(JavaScript Object Notation) 的两个轻量级的数据格式。 JSON其实就是javascript 语法的子集， 就是javascript中的对象和数组。
对象在js中表示为“{}”括起来的内容，数据内部结构为 {key：value,key：value,…}的键值对的内部结构。
数组在js中是中括号“[]”括起来的内容，数据内部结构为 [“java”,”javascript”,”vb”,…]。
这两种内部结构虽然很简单， 但递归组合起来能表达任意的数据内部结构， 这就是简单的力量， 下面就是两个例子：
{
“programmers”:
[{
“firstName”: “Brett”,
“lastName”: “McLaughlin”,
“email”: “aaaa”
}, {
“firstName”: “Jason”,
“lastName”: “Hunter”,
“email”: “bbbb”
}],
“authors”:
[{
“firstName”: “Isaac”,
“lastName”: “Asimov”,
“genre”: “sciencefiction”
}, {
“firstName”: “Tad”,
“lastName”: “Williams”,
“genre”: “fantasy”
}],
“musicians”:
[{
“firstName”: “Eric”,
“lastName”: “Clapton”,
“instrument”: “guitar”
}, {
“firstName”: “Sergei”,
“lastName”: “Rachmaninoff”,
“instrument”: “piano”
}]
}
由于JSON本身就是Javascript 语法的一部分， javascipt代码可以直接把他们当成对象来处置， 根本不用解析XML了。
再加上JSON内部结构很紧凑， 很快就流行开来了， 现在AJAX 基本上都是在用JSON来传递数据了。
题外话：第一次看见AJAX那个词的时候， 作为球迷的我脑海里第一反应是荷兰的阿贾克斯足球俱乐部， 在90年代， 阿贾克斯足球号称青年近卫军， 一帮小孩在欧冠决赛中把如日中天的AC米兰都搞定了， 后来由于《博斯曼法案》的实施，球员可以自由转会， 阿贾克斯就没落了。
