AJAX介绍

AJAX

一、JSON的概念

JavaScript Object Notation JS对象标记。就是指js中对象。

//数据格式
{"name":"mary","sex":"女","age":"20"}

特点：

1. 是一种轻量级的数据传输格式。
2. 在网络中能够有效率的传输。

注意：了解xml格式

在网络发展早期，使用的是xml格式传输数据，后来，移动互联网的兴起，导致需要体积较小的数据传输格式，JSON应运而生。

二、JSON解析

指在JAVA服务器上，将json字符串与Java对象之间相互转换的过程。

即将JSON字符串转换成JAVA对象，或者将JAVA对象转换成JSON字符串。

2.1 原始的方式

手动拼接、切割解析字符串，然后使用反射处理，比较麻烦

2.2 三方库处理方式

FastJson、Jackson、gson

2.2.1 FastJson

FastJson是阿里出品的第三方库。

核心是两个静态方法：

JSON.toJSONString()：将对象转换成JSON字符串

JSON.parseObject()：将字符串转换成Java对象

导入依赖：fastjson-1.2.68.jar

    public static void main(String[] args) throws Exception {
        //1.将对象转成json字符串
        //a.普通对象转json字符串
        Student student = new Student(1, "张三",22,"男");
        String s = JSON.toJSONString(student);
        System.out.println(s);
        //{"id":1,"name":"张三","age":22,"sex":"男"}

        //b.集合对象转json字符串
        List<Student> list = new ArrayList<>();
        list.add(new Student(2, "李四",11,"男"));
        list.add(new Student(3, "王五",33,"男"));
        list.add(new Student(4, "赵六",44,"男"));
        String s1 = JSON.toJSONString(list);
        System.out.println(s1);
        //[{"id":2,"name":"李四","age":11,"sex":"男"},{"id":3,"name":"王五","age":33,"sex":"男"},{"id":4,"name":"赵六","age":44,"sex":"男"}]

        //2.将json字符串转为对象
        //a.普通对象
        Student student1 = JSON.parseObject(s, Student.class);
        System.out.println(student1);
        //Student(id=1, name=张三, age=22, sex=男)

        //b.集合对象
        List<Student> list1 = JSON.parseObject(s1, new TypeReference<List<Student>>() {});
        System.out.println(list1);
        //[Student(id=2, name=李四, age=11, sex=男), Student(id=3, name=王五, age=33, sex=男), Student(id=4, name=赵六, age=44, sex=男)]

    }

2.2.2 Jackson

Jackson主要是用ObjectMapper对象来处理json

是用readValue和writeValue方法进行JSON处理

导入依赖：

jackson-annotations-2.9.10.jar

jackson-core-2.9.10.jar

jackson-databind-2.9.10.jar

public static void main(String[] args) throws Exception {
        //1.将对象转成json字符串
        //a.普通对象转json字符串
        Student student = new Student(1, "张三",22,"男");
        //创建一个ObjectMapper对象
        ObjectMapper mapper = new ObjectMapper();
        //当对象的属性值为空时，也可以转换成json，而不会抛异常
        mapper.disable(SerializationFeature.FAIL_ON_EMPTY_BEANS);
        //将对象转换成json字符串
        String s = mapper.writeValueAsString(student);
        System.out.println(s);
        //{"id":1,"name":"张三","age":22,"sex":"男"}

        //b.集合对象转json字符串
        List<Student> list = new ArrayList<>();
        list.add(new Student(2, "李四",11,"男"));
        list.add(new Student(3, "王五",33,"男"));
        list.add(new Student(4, "赵六",44,"男"));
        String s1 = mapper.writeValueAsString(list);
        System.out.println(s1);
        //[{"id":2,"name":"李四","age":11,"sex":"男"},{"id":3,"name":"王五","age":33,"sex":"男"},{"id":4,"name":"赵六","age":44,"sex":"男"}]

        //2.将json字符串转为对象
        //a.普通对象
        Student student1 = mapper.readValue(s, Student.class);
        System.out.println(student1);
        //Student(id=1, name=张三, age=22, sex=男)

        //b.集合对象
        List<Student> list1 = mapper.readValue(s1, new TypeReference<List<Student>>() {});
        System.out.println(list1);
        //[Student(id=2, name=李四, age=11, sex=男), Student(id=3, name=王五, age=33, sex=男), Student(id=4, name=赵六, age=44, sex=男)]

    }

2.2.3 gson

google的json处理库

使用gson对象

核心方法：

gson.toJSON()：将对象转成json字符串

gson.fromJson()：将字符串转换成Java对象

    public static void main(String[] args) throws Exception {
        //1.将对象转成json字符串
        //a.普通对象转json字符串
        Student student = new Student(1, "张三",22,"男");
        //创建一个gson对象
        Gson gson = new Gson();
        String s = gson.toJson(student);
        System.out.println(s);
        //{"id":1,"name":"张三","age":22,"sex":"男"}

        //b.集合对象转json字符串
        List<Student> list = new ArrayList<>();
        list.add(new Student(2, "李四",11,"男"));
        list.add(new Student(3, "王五",33,"男"));
        list.add(new Student(4, "赵六",44,"男"));
        String s1 = gson.toJson(list);
        System.out.println(s1);
        //[{"id":2,"name":"李四","age":11,"sex":"男"},{"id":3,"name":"王五","age":33,"sex":"男"},{"id":4,"name":"赵六","age":44,"sex":"男"}]

        //2.将json字符串转为对象
        //a.普通对象
        Student student1 = gson.fromJson(s, Student.class);
        System.out.println(student1);
        //Student(id=1, name=张三, age=22, sex=男)

        //b.集合对象
        List<Student> list1 = gson.fromJson(s1,new TypeToken<List<Student>>(){}.getType());
        System.out.println(list1);
        //[Student(id=2, name=李四, age=11, sex=男), Student(id=3, name=王五, age=33, sex=男), Student(id=4, name=赵六, age=44, sex=男)]

    }

三、浏览器中使用JS处理JSON解析

在浏览器中，使用JS的过程中，也会遇到将json转成字符串，或者字符串转成json过程。

核心方法：

JSON.stringfy(json对象)：将JSON转成字符串

JSON.parse(字符串)：将字符串转成JSON

注意：字符串打印无法.属性，json对象可以.属性

<script>
	//创建json对象
	var stu = {"id":1,"name":"张三","sex":"男","age":"20"};
	console.log(stu);
	console.log(typeof(stu));
	
	//将json转成字符串
	var str = JSON.stringify(stu);
	console.log(str);
	console.log(typeof(str));
	
	//将字符串转成json对象
	var stu1 = JSON.parse(str);
	console.log(stu1);
	console.log(typeof(stu1));
</script>

四、AJAX

4.1 概念

Asynchronized JavaScript And XML，异步和JS和XML。

AJAX技术是一种页面局部刷新的技术。

4.2 基本步骤

原生代码基本步骤：

1. 创建Ajax对应的XMLHTTPRequest对象
2. 设置响应（回调）函数
3. 设置请求的方法和请求的URL
4. 发送请求

<script>
	//1.创建Ajax对应的XMLHTTPRequest对象。
	var request;
	if(window.XMLHttpRequest){
		//IE7+以及其他的浏览器
		request = new XMLHttpRequest();
	}else{
		//IE6及以下版本
		request = new ActiveXObject("Microsoft.XMLHTTP");
	}
	//2.设置响应（回调）函数
	//当每次状态改变时会调用后面的函数
	//有5个状态0~4，之后最后一个完成就绪状态时，才需要去调用后面的处理函数
	request..onreadystatechange = function(resp){
		//当请求处理完毕，且状态码为200（成功）
		if(request.readyState == 4 && request.status == 200){
			//局部刷新页面要改变的内容
		}else{
			//错误时执行
		}
	};
	//3.设置请求的方法（GET或POST）和请求的URL，打开连接
	//true表示异步发送请求，是默认值，可以省略，如果写false，表示发送同步请求
	request.open("GET", "服务器url", true);
	
	//4.发送请求
	//send方法中可以传递参数，但是get是通过url传参，post也可以通过url传参
	//但是post也可以通过send传参
	request.send();
	
</script>

4.3 AJAX请求方式

可以查看json中ajax发送请求的方式，见 jquery.md文件