AJAX&JSON&JSON转换为Java&Java对象转换为JSON

AJAX

1. 概念: ASynchronous JavaScript And XML 			异步的JavaScript 和 XML
  	1. 异步和同步: 客户端和服务器端相互通信的基础上
      	  * 同步: 客户端必须等待放服务器端的响应. 在等待的期间客户端不能做其他操作.
          * 异步: 客户端不需要等待服务器的响应. 在服务器处理请求的过程中, 客户端可以进行其他的操作.
    2. 特点:
		  1. Ajax 是一种无需重新加载整个页面的情况下, 能够更新部分网页的技术
          2. 通过在后台与服务器进行少量数据交换, Ajax 可以使网页实现异步更新. 这意味着可以在不重新加载整个页面的情况下, 对页面的某部分进行更新.
          3. 传统的网页(不使用 Ajax)如果需要更新内容, 必须重载整个网页页面.
            
2. 实现方式:
	1. 原生的JS实现方式(了解)
        * 代码:
			// 发送异步请求
            // 1. 创建核心对象
            var xmlhttp;
            if (window.XMLHttpRequest){
                // 高版本浏览器创建对象
                xmlhttp = new XMLHttpRequest();
            } else {
                // 低版本浏览器创建对象
                xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
            }

            // 2. 建立连接
            /*
                参数:
                   1. 请求方式: GET、POST
                        * get方式: 请求参数在URL后边拼接. send方法为空参
                        * post方式: 请求参数在send方法中定义
                   2. 请求的URL
                   3. 同步或异步请求: true(异步) 或 false(同步)
             */
            xmlhttp.open("GET", "ajaxServlet?username=tom", true);

            // 3. 发送请求
            xmlhttp.send();

            // 4. 接受并处理来自服务器的响应结果
            // 获取方式: xmlhttp.responseText
            // 什么时候获取? 当服务器响应成功后再获取

            // 当xmlhttp对象的就绪状态改变时, 触发时间onreadystatechange
            xmlhttp.onreadystatechange = function(){
                // 判断就绪状态是否为4, 判断status响应的状态码是否为200
                if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
                    // 获取服务器的响应结果
                    var responseText = xmlhttp.responseText;
                    alert(responseText);
                }

            }


    2. JQuery实现方式
      	1. $.ajax()
      		* 语法: $.ajax({键值对})
            * 代码:
				// 使用$.ajax发送异步请求
                $.ajax({
                    url: "ajaxServlet", 									// 请求路径
                    type: "post",       									// 请求方式, 默认是get, 就是不写的情况
                    // contentType: "application/json",   // 发送的数据, mime类型
                    async: "true",      						// 异步或同步, true异步, false同步, 默认异步
                    // data: "username=jack&age=23", 			//请求参数, 第一种方式
                    data: {"username": "jack", "age": 23}, // 请求参数, 第二种方式
                    dataType: "text",   									// 设置接受到的响应数据的格式, mime类型
                    success: function(data){    					// 响应成功后的回调
                        alert(data);
                    },
                    error: function(error){  					// 表示如果请求响应出现错误, 会执行的回调函数
                        alert("出错啦...")
                    }
                });

      	2. $.post(): 发送post请求
             * 语法: $.post(url, [data], [callback], [type])
               	  * 参数:
					  * url: 请求路径
                      * data: 请求参数
                      * callback: 回调函数
                      * type: 响应结果的类型
                  * 代码:
					  $.post("ajaxServlet", {"username": "rose"}, function(data){
                          alert(data);
                      }, "text");
          
      	3. $.get(): 发送get请求
          	 * 语法: $.get(url, [data], [callback], [type])
               	  * 参数:
					  * url: 请求路径
                      * data: 请求参数
                      * callback: 回调函数
                      * type: 响应结果的类型
                  * 代码:
					  $.get("ajaxServlet", {"username": "rose"}, function(data){
                          alert(data);
                      }, "text");

JSON

1. 概念: JavaScript Object Notation				JavaScript对象表示法
  	  var p = {"name": "张三", "age": 23, "gender": "男"};

	  * json现在多用于存储和交换文本信息的语法
      * 进行数据的传输
      * JSON 比 XML 更小、更快、更易解析.
      
2. 语法:
  	  1. 基本规则:
    		* 数据在名称/值对中: json数据是由键值对构成
        		* 键用引号(单双都行)引起来, 也可以不适用引号
					* 值得取值类型:
            				1. 数字(整数或浮点数)
							2. 字符串(在双引号中)
							3. 逻辑值(true 或 false)
							4. 数组(在方括号中) 					{"persons": [{}, {}]}
							5. 对象(在花括号中)(json对象) {"address": {"province": "陕西"...}}
							6. null

			* 数据由逗号分隔: 多个键值对由逗号分隔         		         
	        * 花括号保存对象: 使用{}定义json 格式        
	        * 方括号保存数组: []
	        * 代码:
          		  // 1. 定义json
	              var person = {"name": "张三", "age":18, "gender": true};
	
	              // 2. 嵌套格式  {}-->[]
	              var persons = {
	                  "persons": [
	                      {"name": "张三", "age": 18, "gender": true},
	                      {"name": "张三", "age": 18, "gender": true},
	                      {"name": "张三", "age": 18, "gender": true}
	                  ]
	              };
	
	              // 3. 嵌套格式
	              var ps = [
	                  {"name": "张三", "age": 18, "gender": true},
	                  {"name": "张三", "age": 18, "gender": true},
	                  {"name": "张三", "age": 18, "gender": true}
	              ];
      
      2. 获取数据:
           1. json对象.键名
           2. json对象["键名"]
           3. 数组对象[索引]
           4. 代码, 获取数据:
         		// 获取张三
      			var name = person.name;
      			var name = person["name"];
                                        
                // 获取王五
        		var name = persons.persons[2].name;
                                       
                // 获取李四
        		var name = ps[1].name;
           5. 代码, 遍历获取数据:
           		  // 获取person对象中所有的键和值
                  for(var key in person) {
                      // 这样的方式获取不行. 因为相当于 person."name"
                      // alert(key+ ":" +person.key);
                      alert(key + ": "+ person[key]);
                  }


                  // 获取ps中的所有值
                  for (var i = 0; i < ps.length; i++) {
                      var p = ps[i];

                      for(var key in p) {
                          alert(key + ": " + p[key]);
                      }

                  }
                                        
      
3. JSON数据和Java对象的相互转换
	  * JSON解析器:
       		* 创建的JSON解析器: Jsonlib, Gson, fastjson, jackson

	  1. JSON转为Java对象
      		1. 使用步骤:
               1. 导入jackson的相关jar包
               2. 创建jackson核心对象 ObjectMapper
               3. 调用ObjectMapper的相关方法进行转换
            		1. 转换方法:
						* readValue(json数据, Class):
						* 代码:
                            // JSON字符串, 转换为Java, Person对象

                            // 1. 定义Json字符串
                            String json = "{\"name\": \"张三\", \"age\": 23, \"gender\": \"男\"}";

                            // 2. 创建ObjectMapper对象
                            ObjectMapper om = new ObjectMapper();

                            // 3. 转换为Java对象 Person对象
                            Person person = om.readValue(json, Person.class);
                            System.out.println(person); // Person{name='张三', age=23, gender='男'}
												

      2. Java对象转换JSON
      		1. 使用步骤:
               1. 导入jackson的相关jar包
               2. 创建jackson核心对象 ObjectMapper
               3. 调用ObjectMapper的相关方法进行转换
               		1. 转换方法:
                        * writeValue(参数1, obj):
                             参数1:
                               File: 将obj对象转换为JSON字符串, 并保存到指定的文件中
                               Writer: 将obj对象转换为JSON字符串, 并将JSON数据填充到字符输出流中
                               OutputStream: 将obj对象转换为JSON字符串, 并将JSON数据填充到字节输出流中
                        * writeValueAsString(obj): 将对象转为json字符串
                               
                               
                    2. 代码:
                          // 1. 创建Person对象
                          Person p = new Person();
                          p.setName("张三");
                          p.setAge(23);
                          p.setGender("男");

                          // 2. 创建Jackson的核心对象    ObjectMapper
                          ObjectMapper om = new ObjectMapper();

						  String json = om.writeValueAsString(p);
        				  System.out.println(json); // {"name":"张三","age":23,"gender":"男"}
      		
						  // writeValue, 将数据写到/Users/xiaoge/Desktop/a.txt文件中
        				  om.writeValue(new File("/Users/xiaoge/Desktop/a.txt"), p);
						  // 桌面上多了一个a.txt内容为{"name":"张三","age":23,"gender":"男"}

        			      // writeValue, 将数据关联到Writer中
        				  om.writeValue(new FileWriter("/Users/xiaoge/Desktop/c.txt"), p);
													// 桌面上多了一个c.txt内容为{"name":"张三","age":23,"gender":"男"}


					3. 注解:
						  1. @JsonIgnore: 排除属性
                          2. @JsonFormat: 属性值得格式化
                            		@JsonFormat(pattern = "yyyy-MM-dd")  // 属性格式化
                          3. 代码, 定义类时, 在属性 或 方法上加注解:
								1. person类属性
									  private String name;
	                                  private Integer age;
	                                  private String gender;
	
	                                  // @JsonIgnore 忽略该属性, 把该对象实例, 转换为JSON时, 该属性忽略
	                                  @JsonFormat(pattern = "yyyy-MM-dd")  // 属性格式化
	                                  private Date birthday;
	
								2. 忽略属性 和 格式化属性, 转换的json值:
										Person p = new Person();
	                                    p.setName("张三");
	                                    p.setAge(23);
	                                    p.setGender("男");
	                                    p.setBirthday(new Date());
	
	
	                                    // 2. 转换
	                                    ObjectMapper om = new ObjectMapper();
	
	                                    String json = om.writeValueAsString(p);
	                                    System.out.println(json); 
										// 没加注解: {"name":"张三","age":23,"gender":"男","birthday":1581492798086}
	                                    
										// @JsonIgnore: {"name":"张三","age":23,"gender":"男"}                          
	
										// @JsonFormat: {"name":"张三","age":23,"gender":"男","birthday":"2020-02-12"}


						  4. 复杂java对象转换:
								1. List: 数组
                                  	* 代码:
																				// 1. 创建Person对象
                                        Person p1 = new Person();
                                        p1.setName("张三");
                                        p1.setAge(23);
                                        p1.setGender("男");
                                        p1.setBirthday(new Date());

                                        Person p2 = new Person();
                                        p2.setName("李四");
                                        p2.setAge(23);
                                        p2.setGender("男");
                                        p2.setBirthday(new Date());

                                        Person p3 = new Person();
                                        p3.setName("王五");
                                        p3.setAge(23);
                                        p3.setGender("男");
                                        p3.setBirthday(new Date());


                                        // 创建集合
                                        List<Person> ps = new ArrayList<Person>();
                                        ps.add(p1);
                                        ps.add(p2);
                                        ps.add(p3);

                                        // 2. 转换
                                        ObjectMapper om = new ObjectMapper();

                                        String json = om.writeValueAsString(ps);

                                        /*

                                            [
                                                {"name": "张三", "age": 23, "gender": "男", "birthday": "2020-02-12"},
                                                {"name": "李四", "age": 23, "gender": "男", "birthday": "2020-02-12"},
                                                {"name": "王五", "age": 23, "gender": "男", "birthday": "2020-02-12"},
                                            ]

                                         */
                                        System.out.println(json);
																				
                                2. Map: 对象格式一致
                                  	* 代码:
																				// 1. 创建集合
                                        Map<String, Object> map = new HashMap<String, Object>();
                                        map.put("name", "张三");
                                        map.put("age", 23);
                                        map.put("gender", "男");

                                        // 2. 转换
                                        ObjectMapper om = new ObjectMapper();

                                        String json = om.writeValueAsString(map);

                                        /*
                                            {"name": "张三", "age": 23, "gender": "男"}
                                         */
                                        System.out.println(json);

服务器响应的数据, 在客户端使用时, 要想当做json数据格式使用

1. $.get(type): 将最后一个参数type指定为"json"
2. $.post(type): 将最后一个参数type指定为"json"
3. $.ajax(dataType): 键dataType指定为"json"
4. JSON.parse(服务器返回的数据); 将服务器返回的数据转换成"json"
5. 在服务器端设置MIME类型: response.setContentType("application/json;charset=utf-8");