1.前言

现在Ajax技术已逐步使用JSON响应来获取传统的XML响应。当服务器响应数据量较大，而且响应数据有复杂的结构关系时，使用JSON响应是很好的选择。

2.例子

下面的例子示范一个用户根据种类查看图书的示例，该服务器响应是N本图书信息，它们具有数据量较大，而且具有复杂的结构关系的特征，为此考虑使用JSON响应进行处理。

（源码）

1)        下面是提供服务器相应的Servlet代码。

@WebServlet(urlPatterns={"/chooseBook"}) public class ChooseBookServlet extends HttpServlet { public void service(HttpServletRequest request , HttpServletResponse response) throws IOException , ServletException { String idStr = (String)request.getParameter("id"); int id = idStr == null ? 1 : Integer.parseInt(idStr); List<Book> books = new BookService().getBookByCategory(id); response.setContentType("text/html;charset=GBK"); PrintWriter out = response.getWriter(); out.println(new JSONArray(books)); } } 2) BookService是一个简单的业务逻辑组件，它直接使用了一个Map来模拟系统数据库。BookService类代码如下。
public class BookService { // 模拟内存中数据库 static Map<Integer , List<Book>> bookDb = new LinkedHashMap<>(); static { // 初始化bookDb对象 List<Book> list1 = new ArrayList<>(); List<Book> list2 = new ArrayList<>(); List<Book> list3 = new ArrayList<>(); list1.add(new Book(1 , "Java" , "owen" , 109)); list1.add(new Book(2 , "Java EE" , "owen" , 99)); list1.add(new Book(3 , "Android" , "owen" , 89)); list2.add(new Book(4 , "西游记" , "吴承恩" , 23)); list2.add(new Book(5 , "水浒" , "施耐庵" , 20)); list3.add(new Book(6 , "乌合之众" , "古斯塔夫.勒庞" , 16)); list3.add(new Book(7 , "不合时宜的考察" , "尼采" , 18)); bookDb.put(1 , list1); bookDb.put(2 , list2); bookDb.put(3 , list3); } public List<Book> getBookByCategory(int categoryId) { return bookDb.get(categoryId); } }

3)        当服务器向浏览器生成符合JSON格式字符串以后，浏览器端需要解析该JOSN字符串，将它解析成JavaScript对象或JavaScript数组。一旦将服务器响应数据“转换“成JavaScript对象或JavaScript数组，接下来使用DOM将响应显示出来即可。下面是JSON响应回调函数代码。

// 定义处理响应的回调函数 function processResponse() { // 响应完成且响应正常 if (xmlrequest.readyState == 4) { if (xmlrequest.status == 200) { var bookTb = document.getElementById("book"); // 删除bookTb原有的所有行 while(bookTb.rows.length > 0) { bookTb.deleteRow(bookTb.rows.length - 1); } // 获取服务器的JSON响应 // 并调用eval()函数将服务器响应解析成JavaScript数组 var books = eval(xmlrequest.responseText); // 遍历数组，每个数组元素生成一个表格行 for (var i = 0 , len = books.length ; i < len ; i++) { var tr = bookTb.insertRow(i); // 依次创建4个单元格，并为单元格设置内容 var cell0 = tr.insertCell(0); cell0.innerHTML = books[i].id; var cell1 = tr.insertCell(1); cell1.innerHTML = books[i].name; var cell2 = tr.insertCell(2); cell2.innerHTML = books[i].author; var cell3 = tr.insertCell(3); cell3.innerHTML = books[i].price; } } else { //页面不正常 window.alert("您所请求的页面有异常。"); } } }

4)        运行结果