Ajax & Json 简介

Ajax & Json简介

Ajax

1.同步请求&异步请求

1.1同步请求

• 请求方式

  • <form action="#"></form>
  • location = “”

• 缺点

  • 发出请求 , 作出相应 , 如响应之前, 整个页面无法访问 [页面卡主 , 降低用户体验度]
  • 即使页面需要少量的更改 ,也需要刷新整个页面 . [增加服务器压力]

1.2异步请求 [局部请求]

• 请求方式 : ajax
• 弥补同步请求不足

2.Ajax简介

• Ajax全称 : ：A**synchronous Javascript And XML”（异步JavaScript和XML）
• Ajax本质 : 通过js向服务器发送异步请求 [局部请求 ,不刷新浏览器] , 并相应数据技术 [回调函数]

3.Ajax语法

3.1标准语法

$.ajax({
   url : "${pageContext.request.contextPath}/AjaxServlet", // 请求地址路径
   type : "GET",   // 设置请求方式【GET(默认值)|POST|PUT|DELETE】
   data : {"name" : "laoxu" , "age" : 19},     // 设置请求参数
   dataType :  "json",
   success : function (rs) {          // 设置成功回调函数
           alert("rs :" + rs.name);
     },

       error : function () {
             alert("请求失败! error");
     }
});

3.2 简写

• get请求简写语法

  **url,[data],[callback],[type]**String,Map,Function,String

  url:待载入页面的URL地址

  data:待发送 Key/value 参数。

  callback:载入成功时回调函数。

  type:返回内容格式，xml, html, script, json, text, _default。

  $.get("${pageContext.request.contextPath}/AjaxServlet",{"name" : "laoxu" , "age" : 19},function (rs) {
            alert("rs :" + rs.name);
        },"json");
  

• post请求简写语法

  **url,[data],[callback],[type]**String,Map,Function,String

  url:发送请求地址。

  data:待发送 Key/value 参数。

  callback:发送成功时回调函数。

  type:返回内容格式，xml, html, script, json, text, _default。

  $.post("${pageContext.request.contextPath}/AjaxServlet","name=John&location=Boston", function(msg){
      alert( "Data Saved: " + msg );
  },"text");
  

• get请求&服务器预期返回json类型 , 简写语法

  $.getJSON("${pageContext.request.contextPath}/AjaxServlet",{"name" : "laoxu" , "age" : 19},function (rs) {
      alert("rs :" + rs.name);
  });
  

JSON简介

1.JSON简介

• Json全称：JavaScript Object Notation 的缩写
• Json是JS提供的一种轻量级的数据交换格式
• Json本质上就是一个JS对象，只是这个对象比较特殊，可以直接与String相互转换
• Json用于在不同语言及不同生态之间进行数据传递。

2.JSON语法

• 语法 :

  • var jsonObj ={“key” : “value” , “key2” : “values2”…}
  • json 的key是建议使用字符串 , json的value使用js支持类型即可

• 调用

  <script type="text/javascript" src="jquery-1.7.2.js"></script>
  <script type="text/javascript">
          // json 定义
      var jsonObj = {
          "key1" : 12,
          "key2" : "abc",
          "key3" : true,
          "key4" :[1,"bac",true],
          "key5" : {
              "key5_1" : 1,
              "key5_2" : "abc"
          },
  
          "key6" : [{
              "key6_1_1" : 611,
              "key6_1_2" : 622,
          },
              {
                  "key6_2-1" : 611,
                  "key6_2_2" : 622,
              }]
      };
  
      // json 的访问
  
      // alert(jsonObj.key1);   // 12
      // alert(jsonObj.key4[2]);    // true
      // alert(jsonObj.key5.key5_2);   //abc
      alert(jsonObj.key6[0].key6_1_1);  // 611
  </script>
  

3.JSON使用

• Json使用场景 : json用于在不同语言及不同生态之间进行数据传递

• 在js语言环境下 , json对象与jsonString转换问题

  • jsonObj -> jsonString
    • var jsonString = JSON.stringify(json); 将一个json转换成json字符串
  • Jsontring - > jsonObj
    • var jsonObj = JSON.parse(jsonString) ; 此方法将json字符串转化为json对象

• 在java语言环境下，java对象【bean|List|Map】与jsonString转换问题

  • Java对象 - > jsonString
    • String jsonString = gson.toJson(obj) ; 将java对象转换为json字符串
  • jsonString -> Java 对象
    • Object obj = gson.fromJson(String JsonString , Object.class);
    • Object obj = gson.fromJson(String jsonString,Type);

• 代码

  • 普通

    @Test
     public void test() {
        // 创建person对象
        Person person = new Person(1001, "小可爱");
    
        // 创建gson的工具类
        Gson gson = new Gson();
        // 把person对象转换为json对象
        String s = gson.toJson(person);
        System.out.println("s = " + s);
    
        // 把json字符串转化为person对象
        Person person1 = gson.fromJson(s, Person.class);
        System.out.println("person1 = " + person1);
    }
    

  • list

    @Test
    public void test01() {
        List<Person> personList = new ArrayList<>();
        personList.add(new Person(1,"p1"));
        personList.add(new Person(2,"p2"));
        personList.add(new Person(3,"p3"));
    
        // 创建gson对象
        Gson gson = new Gson();
        // 将list转换成json对象
        String s = gson.toJson(personList);
        System.out.println("s = " + s);
    
        // 将json字符串转化为list集合
        Object o = gson.fromJson(s, new TypeToken<List<Person>>() {
        }.getType());
        System.out.println("o = " + o);
    }
    

  • map

    // map 和 json转换
    @Test
    public void test02() {
        Map<String , Person> map = new HashMap<>();
        map.put("p1",new Person(1,"加油1号"));
        map.put("p2",new Person(2,"加油2号"));
        map.put("p3",new Person(3,"加油3号"));
    
        Gson gson = new Gson();
    
        // 将map集合转化为 json对象
        String s = gson.toJson(map);
    
        System.out.println("s = " + s);
    
        // 将json对象转换为map集合
    
        Object o = gson.fromJson(s, new TypeToken<Map<String, Person>>() {
        }.getType());
        System.out.println("o = " + o);
    }