Ajax简介&Json数据格式（四）
站长
· 阅读数 12
第四章 JSON数据格式【JS解析】
xml： 张三
json： {"name":"张三"}
1、什么是JSON
JSON 是一种轻量级的数据交换格式。它基于ECMAScript的一个子集，采用完全独立于编程语言的文本格式来存储和表示数据。简洁和清晰的层次结构使得 JSON 成为理想的数据交换语言。 易于人阅读和编写，同时也易于机器解析和生成，并有效地提升网络传输效率。 JSON是javascript的原生对象。
javascript Object notation
2、JSON的语法格式
JSON数据有三种数据格式，分别如下：
【注意】
-
JSON数据的key值：字符串类型，必须加双引号；
-
JSON数据的value值：任意类型，如果是字符串则必须加双引号；
-
三种数据格式举例：
1）对象类型：第一种：{“name”:”张三”,”age”:34,”shuaima”:false}
2）数组/集合类型：第二种：[{“name”:”zhangsan”,”age”:67,”addr”:”上海”},{“name”:”lisi”,”age”:67,”addr”:”上海”},{“name”:”wangwu”,”age”:67,”addr”:”上海”}]
3）混合类型：第三种：
var stu_score = { "name":"张三", "scores":[ {"course":"语文","score":100}, {"course":"数学","score":100}, {"course":"英语","score":100} ] }
3、JSON对象和JSON字符串
3.1 JSON对象
JSON 指的是 JavaScript 对象表示法（JavaScript Object Notation）。JSON 格式在语法上与创建 JavaScript 对象代码是相同的。因此，可以把JSON看成是JavaScript对象。
【JS对象】
【JSON对象】严格的JS对象，key都加双引号。
3.2 JSON字符串
JSON数据格式是一种文本数据，从服务器传递过来的数据有时候可能是以字符串的形式传递过来如下：
我们可以在js中调用JSON对象的parse方法，将JSON字符串转换成JSON对象：
var personJson = JSON.parse(person);
4、JSON格式与JSON解析练习
练习一：JSON对象类型
格式：
var person = {"name":"张三","age":13}
【参考代码】
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
</body>
<script>
//JSON对象类型
var person = {"name":"张三","age":13};
alert(person);
alert(person.name);
alert(person.age);
</script>
</html>
练习二：JSON数组
格式：
var personList = [ {"name":"张三","age":13}, {"name":"李四","age":14}, {"name":"王五","age":15} ]
【参考代码】
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
</body>
<script>
//JSON数据格式二：JSON数据
var personList = [
{"name":"张三","age":13},
{"name":"李四","age":14},
{"name":"王五","age":15}
];
for(var i = 0;i<personList.length;i++) {
alert(personList[i].name + ":::" + personList[i].age);
}
</script>
</html>
练习三：混合类型
格式：
var stu_score = {
"name":"张三",
"scores":[
{"course":"语文","score":100},
{"course":"数学","score":100},
{"course":"英语","score":100}
]
}
【参考代码】
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
</body>
<script>
//JSON数据格式三：混合类型
var stu_score = {
"name":"张三",
"scores":[{"course":"语文","score":100},{"course":"数学","score":90},{"course":"英语","score":80} ]
};
//获取各门学科的成绩
var scores = stu_score.scores;
for(var i = 0;i<scores.length;i++) {
alert(scores[i].course + "的分数是：" + scores[i].score);
}
</script>
</html>
5、 JSON格式转换
* JSON对象与字符串转换的相关函数
语法：
1. JSON.stringify(object) 把json对象转为字符串
2. JSON.parse(string) 把字符串转为json对象
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<script >
/*
* * JSON对象与字符串转换的相关函数
语法：
1. JSON.stringify(object) 把json对象转为字符串(知道,没什么运用)
2. JSON.parse(string) 把字符串转为json对象 (掌握)
场景:
服务器给浏览器响应数据 : json格式的字符串
a. json在js中是对象
b. json在java是字符串
浏览器给服务器发送的请求数据:
如果是json对象,自动变成字符串
* */
//这是json对象
let json = {"name" : "张三","age" : 18}
// js字符串可以是单引或双引, json字符串必须是双引
//json格式的字符串
let jsonStr = '{"name" : "张三","age" : 18}'
console.log(typeof jsonStr) // string
console.log(jsonStr.name) // undefined
//json格式的字符串 -> json对象 (重要!!!)
let jsonObj = JSON.parse(jsonStr);
console.log(typeof jsonObj) // object
console.log(jsonObj.name) // "张三"
//对象 -> 字符串
let str = JSON.stringify(json)
console.log(typeof str) // string
console.log(str.name) // undefined
</script>
</body>
</html>
第五章 JSON转换工具（服务器端生成 json格式数据 ）
json在js中属于对象，但是在java中属于一个json格式的字符串。前端中,ajax请求需要dataType:json 将后台响应的json字符串,解析成json对象,才能正常使用.所以我们在后台先将数据转换为json字符串，然后前端获取更加方便。
JSON的转换工具是通过java封装好的一些jar工具包即依赖第三方开源类库，直接将java对象或集合转换成json格式的数据。
常见的jar包有以下几种：
我们这里使用JackSon来转化json数据。
1、开发步骤
-
导入JackSon相关依赖
<!--JackSon--> <dependency> <groupId>com.fasterxml.jackson.core</groupId> <artifactId>jackson-core</artifactId> <version>2.9.4</version> </dependency> <dependency> <groupId>com.fasterxml.jackson.core</groupId> <artifactId>jackson-databind</artifactId> <version>2.9.4</version> </dependency> <!--fastjson--> <dependency> <groupId>com.alibaba</groupId> <artifactId>fastjson</artifactId> <version>1.2.47</version> </dependency> -
创建java对象和集合；
-
使用JackSon包中提供的对象映射器类ObjectMapper类，创建该类对象
-
调用类中的方法String writeValueAsString(对象或集合)将对象或集合转换为json字符串
ObjectMapper对象中的方法 说明 String writeValueAsString(Object o) 将一个对象转成JSON格式的字符串
2、转换java代码实现
【Student实体类】Student.java
package com.hea.pojo;
public class Student {
private Integer id;
private String studentName;
private int studentAge;
public Integer getId() {
return id;
}
public void setId(Integer id) {
this.id = id;
}
public String getStudentName() {
return studentName;
}
public void setStudentName(String studentName) {
this.studentName = studentName;
}
public int getStudentAge() {
return studentAge;
}
public void setStudentAge(int studentAge) {
this.studentAge = studentAge;
}
@Override
public String toString() {
return "Student{" +
"id=" + id +
", studentName='" + studentName + ''' +
", studentAge=" + studentAge +
'}';
}
}
2.1 转换java对象
【参考代码】
public class JavaBeanToJson {
@Test
public void test01() throws JsonProcessingException {
//1.简单对象
Student stu1 = new Student();
stu1.setId(1);
stu1.setStudentName("张三");
stu1.setStudentAge(10);
/*
JackSon (springMVC底层转换工具)
1. 创建对象映射器
2. 转换
*/
ObjectMapper om = new ObjectMapper();
String json = om.writeValueAsString(stu1);
System.out.println(json);
}
}
【运行结果】
{"id":1,"studentAge":10,"studentName":"张三"}
2.2 转换List集合
【测试代码】
public class JavaBeanToJson {
@Test
public void test01() throws JsonProcessingException {
//1.简单对象
Student stu1 = new Student();
stu1.setId(1);
stu1.setStudentName("张三");
stu1.setStudentAge(10);
Student stu2 = new Student();
stu2.setId(2);
stu2.setStudentName("李四");
stu2.setStudentAge(12);
//2.集合
List<Student> stuList = new ArrayList<>();
stuList.add(stu1);
stuList.add(stu2);
/*
JackSon (springMVC底层转换工具)
1. 创建对象映射器
2. 转换
*/
ObjectMapper om = new ObjectMapper();
String json = om.writeValueAsString(stuList);
System.out.println(json);
}
【运行结果】
[{ "id": 1,"studentAge": 10, "studentName": "张三"},{"id": 2, "studentAge": 12,"studentName": "李四"}]
2.3 转换复杂对象
【测试代码】
【注意】复杂对象可以用Map<String,Object> 集合来拼接；如下：
public class MapToJson {
@Test
public void test01() throws JsonProcessingException {
//1.简单对象
Student stu2 = new Student();
stu2.setId(2);
stu2.setStudentName("李四");
stu2.setStudentAge(12);
Map<String, Object> map = new HashMap<>();
map.put("code", "1001");
map.put("stu", stu2);
/*
JackSon (springMVC底层转换工具)
1. 创建对象映射器
2. 转换
*/
ObjectMapper om = new ObjectMapper();
String json = om.writeValueAsString(map);
System.out.println(json);
}
}
【运行结果】
{"code":"1001","stu":{"id":2,"studentAge":12,"studentName":"李四"}}
【小结】以上三种转换对应着JSON数据的3中数据格式
- 将java对象---转换为---JSON对象：
{"id":1,"studentAge":10,"studentName":"张三"}
- 将List集合--转换为--JSON数组：
[{ "id": 1,"studentAge": 10, "studentName": "张三"},{"id": 2, "studentAge": 12,"studentName": "李四"}]
- 将复杂对象--转换为---JSON混合数据类型：
{"code":"1001","stu":{"id":2,"studentName":"李四","studentAge":12}}