Ajax_Json

Ajax_Json

Ajax

1. 同步请求&异步请求

• 同步请求
  • 请求方式【语法格式】
    • <form action="#" method=""></form>
    • <a href="#"></a>
    • <img src="#">
    • location.href = “”
    • 等…
  • 同步请求不足
    • 浏览器向服务器发送请求后，如服务器未响应【响应之前网速慢】，容易出现“卡死”状态，降低用户体验度。
    • 即使当前页面需要加载【刷新】少量数据，也必须刷新整个页面。增加服务器压力。
• 异步请求
  • 请求方式
    • ajax
  • 使用Ajax注意事项
    • 使用异步请求，弥补同步请求不足。所以，一般在研发中，我们经常会遇到同步&异步共同使用。
    • 使用Ajax也可以发送同步请求：【async：false】即可。

2. Ajax简介

• ajax全称：Asynchronous Javascript And XML【异步JS和XML】
• ajax实际是：在不发生页面跳转，就可以使用JavaScript异步发送请求并接受响应【改写局部内容】的技术。

3. Ajax语法

回调函数：在特定情况下，会自动调用回目标位置的函数。

• ajax标准语法

  $.ajax({
      type: "POST",                                   //请求方式【GET|POST|PUT|DELETE】
      url: "AjaxServlet",                             //设置请求URL路径
      // data: "name=John&location=Boston",           //请求参数
      data: {"name":"gaohu","location":"beijing"},    //请求参数
      dataType:"json",                                //预期服务器返回的数据类型【text|json】
      success: function(rs){                          //请求成功时回调函数
          alert( "Data Saved: " + rs.location );
      },
      error:function () {                             //请求失败回调函数
          alert("请求失败！");
      }
  });
  

• ajax简写语法

  • $.get(url,[data],[success:fn],[dataType]); //get请求

  • $.post(url,[data],[success:fn],[dataType]); //post请求

  • $.getJSON(url,[data],[success:fn]); //get请求，服务器预期返回JSON格式

Json

1. Json简介

• Json全称：JavaScript Object Notation【是JS提供的一种轻量级的数据交换格式】
• Json对象本质就是JavaScript对象，该对象可以在不同语言，不同生态之间进行数据传递。
  • Json对象可以与字符串之间类型转换。

2. Json语法

• 语法格式：var jsonObj = {“key”:value,“key2”:value2,…}

• 建议key是string类型，value是javaScript支持的数据类型即可。

  • js数据类型：string、number、boolean、undefined、null、数组、函数、对象

• 基本使用

  var jsons = {
      "key1":"abc", // 字符串类型
      "key2":1234,  // Number
      "key3":[1234,"21341","53"], // 数组
      "key4":{                    // json类型
          "key4_1" : 12,
          "key4_2" : "kkk"
      },
      "key5":[{                  // json数组
          "key5_1_1" : 12,
          "key5_1_2" : "abc"
      },
          {
              "key5_2_1" : 41,
              "key5_2_2" : "bbj"
          }]
  };
  // alert(jsons.key1);      //"abc"
  // alert(jsons.key3[2]);   //53
  // alert(jsons.key4.key4_2);      //"kkk"
  // alert(jsons.key5[0].key5_1_2);      //"abc"
  alert(jsons.key5[1].key5_2_1);      //41
  

3. 使用Json在不同语言之间，数据交互问题

3.1 JavaScript语言

• Json对象转发为Json字符串
  • var jsonString = JSON.stringify( jsonObj )：此方法可以把一个json对象转换成为json字符串
• Json字符串转换为Json对象
  • var jsonObj = JSON.parse( jsonString )： 此方法可以把一个json字符串转换成为json对象

3.2 Java语言

使用Google下的Gson对象

• Java对象【Bean|List|Map】转换为JsonString【json字符串】

  • String jsonString = gson.toJson(Object obj);

• JsonString转发为Java对象【Bean|List|Map】

• Object obj = gson.fromJson(“jsonString”,Object.class);

  • Object obj = gson.fromJson(“jsonString”,Type type);

• 示例代码

   /**
       * JavaBean与jsonString转换问题
       */
      @Test
      public void testJavaBeanToJsonString(){
          Gson gson = new Gson();
          Student student = new Student(1001,"gaohu");
          //student->jsonString
  //        String jsonString = "{\"id\":1001,\"name\":\"gaohu\"}";
          //第三方Gson
          String jsonString = gson.toJson(student);
          System.out.println("jsonString = " + jsonString);
          //jsonString->JavaBean
          Student student1 = gson.fromJson(jsonString, Student.class);
          System.out.println("student1 = " + student1);
      }
  
      /**
       * List
       */
      @Test
      public void testListToJsonString(){
          List<Student> list = new ArrayList<>();
          list.add(new Student(1001,"gaohu"));
          list.add(new Student(1002,"gaohu2"));
          list.add(new Student(1003,"gaohu3"));
          //list->jsonString   String jsonString = {{},{},{}}  或  [{},{},{}]
          Gson gson = new Gson();
          String jsonString = gson.toJson(list);
          System.out.println("jsonString = " + jsonString);
          //jsonString->List<Student>
  //        ArrayList arrayList = gson.fromJson(jsonString, ArrayList.class);
  //        System.out.println(((Student)arrayList.get(0)).getName());  //错误的， com.google.gson.internal.LinkedTreeMap
          List<Student> list1 = gson.fromJson(jsonString,new TypeToken<List<Student>>(){}.getType());
          for (Student student : list1) {
              System.out.println("student.getName() = " + student.getName());
          }
  
      }
      /**
       * Map
       */
      @Test
      public void testMapToJsonString() {
          Map<String,Student> map = new HashMap<>();
          map.put("gaohu",new Student(1001,"gaohu"));
          map.put("gaohu2",new Student(1002,"gaohu2"));
          map.put("gaohu3",new Student(1003,"gaohu3"));
          //将map->jsonString
          Gson gson = new Gson();
          String jsonString = gson.toJson(map);
          System.out.println("jsonString = " + jsonString);
          //jsonString->Map<String,Student>
          Map<String,Student> map1 =  gson.fromJson(jsonString,new TypeToken<Map<String,Student>>(){}.getType());
          Student student = map1.get("gaohu");
          System.out.println("student = " + student.getName());
      }