Json學習

JSON JavaScript Object Notation)一種簡單的數據格式,比xml更輕巧。 JSON JavaScript 原生格式,這意味着在 JavaScript 中處理 JSON 數據不需要任何特殊的 API 或工具包。

JSON的規則很簡單: 對象是一個無序的“‘名稱/值’對”集合。一個對象以“{”(左括號)開始,“}”(右括號)結束。每個“名稱”後跟一個“:”(冒號);“‘名稱/值’ 對”之間使用“,”(逗號)分隔。具體細節參考http://www.json.org/json-zh.html

舉個簡單的例子:

js 代碼
  1. function showJSON() {
  2. var user =
  3. {
  4. "username":"andy",
  5. "age":20,
  6. "info": { "tel": "123456", "cellphone": "98765"},
  7. "address":
  8. [
  9. {"city":"beijing","postcode":"222333"},
  10. {"city":"newyork","postcode":"555666"}
  11. ]
  12. }
  13. alert(user.username);
  14. alert(user.age);
  15. alert(user.info.cellphone);
  16. alert(user.address[0].city);
  17. alert(user.address[0].postcode);
  18. }

這表示一個user對象,擁有username, age, info, address 等屬性。

同樣也可以用JSON來簡單的修改數據,修改上面的例子

js 代碼
  1. function showJSON() {
  2. var user =
  3. {
  4. "username":"andy",
  5. "age":20,
  6. "info": { "tel": "123456", "cellphone": "98765"},
  7. "address":
  8. [
  9. {"city":"beijing","postcode":"222333"},
  10. {"city":"newyork","postcode":"555666"}
  11. ]
  12. }
  13. alert(user.username);
  14. alert(user.age);
  15. alert(user.info.cellphone);
  16. alert(user.address[0].city);
  17. alert(user.address[0].postcode);
  18. user.username = "Tom";
  19. alert(user.username);
  20. }

JSON提供了json.js包,下載http://www.json.org/json.js 後,將其引入然後就可以簡單的使用object.toJSONString()轉換成JSON數據。

js 代碼
  1. function showCar() {
  2. var carr = new Car("Dodge", "Coronet R/T", 1968, "yellow");
  3. alert(carr.toJSONString());
  4. }
  5. function Car(make, model, year, color) {
  6. this.make = make;
  7. this.model = model;
  8. this.year = year;
  9. this.color = color;
  10. }

可以使用eval來轉換JSON字符到Object

js 代碼
  1. function myEval() {
  2. var str = '{ "name": "Violet", "occupation": "character" }';
  3. var obj = eval('(' + str + ')');
  4. alert(obj.toJSONString());
  5. }

或者使用parseJSON()方法

js 代碼
  1. function myEval() {
  2. var str = '{ "name": "Violet", "occupation": "character" }';
  3. var obj = str.parseJSON();
  4. alert(obj.toJSONString());
  5. }

下面使用prototype寫一個JSONajax例子。

先寫一個servlet (我的是servlet.ajax.JSONTest1.java)就寫一句話
java 代碼
  1. response.getWriter().print("{ /"name/": /"Violet/", /"occupation/": /"character/" }");

再在頁面中寫一個ajax的請求

js 代碼
  1. function sendRequest() {
  2. var url = "/MyWebApp/JSONTest1";
  3. var mailAjax = new Ajax.Request(
  4. url,
  5. {
  6. method: 'get',
  7. onComplete: jsonResponse
  8. }
  9. );
  10. }
  11. function jsonResponse(originalRequest) {
  12. alert(originalRequest.responseText);
  13. var myobj = originalRequest.responseText.parseJSON();
  14. alert(myobj.name);
  15. }

prototype-<st1:chsdate w:st="on" isrocdate="False" islunardate="False" day="30" month="12" year="1899">1.5.1</st1:chsdate>.js中提供了JSON的方法,String.evalJSON(), 可以不使用json.js, 修改上面的方法

js 代碼
  1. function jsonResponse(originalRequest) {
  2. alert(originalRequest.responseText);
  3. var myobj = originalRequest.responseText.evalJSON(true);
  4. alert(myobj.name);
  5. }

JSON還提供了java的jar包 http://www.json.org/java/index.html API也很簡單,下面舉個例子

在javascript中填加請求參數

js 代碼
  1. function sendRequest() {
  2. var carr = new Car("Dodge", "Coronet R/T", 1968, "yellow");
  3. var pars = "car=" + carr.toJSONString();
  4. var url = "/MyWebApp/JSONTest1";
  5. var mailAjax = new Ajax.Request(
  6. url,
  7. {
  8. method: 'get',
  9. parameters: pars,
  10. onComplete: jsonResponse
  11. }
  12. );
  13. }

使用JSON請求字符串就可以簡單的生成JSONObject並進行解析,修改servlet添加JSON的處理(要使用json.jar)

java 代碼
  1. private void doService(HttpServletRequest request, HttpServletResponse response) throws IOException {
  2. String s3 = request.getParameter("car");
  3. try {
  4. JSONObject jsonObj = new JSONObject(s3);
  5. System.out.println(jsonObj.getString("model"));
  6. System.out.println(jsonObj.getInt("year"));
  7. } catch (JSONException e) {
  8. e.printStackTrace();
  9. }
  10. response.getWriter().print("{ /"name/": /"Violet/", /"occupation/": /"character/" }");
  11. }

同樣可以使用JSONObject生成JSON字符串,修改servlet

java 代碼
  1. private void doService(HttpServletRequest request, HttpServletResponse response) throws IOException {
  2. String s3 = request.getParameter("car");
  3. try {
  4. JSONObject jsonObj = new JSONObject(s3);
  5. System.out.println(jsonObj.getString("model"));
  6. System.out.println(jsonObj.getInt("year"));
  7. } catch (JSONException e) {
  8. e.printStackTrace();
  9. }
  10. JSONObject resultJSON = new JSONObject();
  11. try {
  12. resultJSON.append("name", "Violet")
  13. .append("occupation", "developer")
  14. .append("age", new Integer(22));
  15. System.out.println(resultJSON.toString());
  16. } catch (JSONException e) {
  17. e.printStackTrace();
  18. }
  19. response.getWriter().print(resultJSON.toString());
  20. }
js 代碼
  1. function jsonResponse(originalRequest) {
  2. alert(originalRequest.responseText);
  3. var myobj = originalRequest.responseText.evalJSON(true);
  4. alert(myobj.name);
  5. alert(myobj.age);
  6. }

文章出自:http://www.iteye.com/topic/71343

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章