Javascript的对象表示__JSON

• 语法
• 遍历
• json和java对象相互转换

一、基本介绍

1. 概念： JavaScript Object Notation JavaScript对象表示法
2. 描述对象：var p = {"name":"张三","age":23,"gender":"男"};
   • JSON现在多用于存储和交换文本信息的语法
   • 进行数据的传输
   • JSON 比 XML 更小、更快，更易解析。

     二、语法

     1. 基本规则

3. 数据在名称/值对中：json数据是由键值对构成的。
   • 键用引号（单双都可）引起来，也可以不使用引号。
   • 值的取值类型：
     • 数字（整数或浮点数）
     • 字符串（在双引号中）
     • 逻辑值（true 或 false）
     • 数组（在方括号中）{“persons”:[{},{}]}
     • 对象（在花括号中） {“address” :{“province:”安徽”}}
     • null
4. 数据由逗号分隔：多个键值对由逗号分隔。
5. 花括号保存对象：使用{}定义json格式
6. 方括号保存数组：[]
7. 代码演示

   1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20

   <script> //1.定义基本格式 var person = {"name": "张三", age: 23, 'gender': true}; //alert(person); //2.嵌套格式 {} --> [] var persons = { "persons": [ {"name": "刘能", "age": 56, "gender": true}, {"name": "赵四", "age": 35, "gender": true}, {"name": "谢广坤", "age": 65, "gender": false} ] }; //alert(persons); //2.嵌套格式 [] --> {} var ps = [{"name": "刘能", "age": 56, "gender": true}, {"name": "赵四", "age": 35, "gender": true}, {"name": "谢广坤", "age": 65, "gender": false}]; alert(ps); </script>

   2. 获取数据

   1.json对象.键名

   2. json对象["键名"]

   3.数组对象[索引]

   4.代码演示

   1 2 3 4

   var name = person.name; var name = person["name"]; var name1 = persons.persons[2].name;//谢广坤 var name = ps[1].name;//赵四

   3. 遍历

8. 语法：

   1 2 3 4 5 6 7 8 9 10 11 12 13 14 15

   //获取person对象中所有的键和值 // for in //key是键的字符串格式 只能用方括号获取 for (var key in person){ //alert(key+":"+person.key);//这样的方式获取不行。因为相当于 person."name" 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]); } }

9. 注意：key是键的字符串格式 只能用方括号获取

三、JSON数据和Java对象的相互转换

1. JSON解析器：

• 常见的解析器：Jsonlib，Gson，fastjson，jackson

  2. JSON转为Java对象

1. 使用步骤：

   1. 导入jackson的相关jar包
   2. 创建Jackson核心对象 ObjectMapper
   3. 调用ObjectMapper的相关方法进行转换

2. 转换方法：
   readValue(json字符串数据,Class)

3. 代码演示

   1 2 3 4 5 6 7 8 9 10 11 12 13

   @Test public void test5() throws Exception { //1.初始化JSON字符串 String json = "{\"gender\":\"男\",\"name\":\"赵四\",\"age\":\"56\"}"; //2.创建ObjectMapper对象 ObjectMapper mapper = new ObjectMapper(); //3.转换为Java对象 Person Person person = mapper.readValue(json, Person.class); System.out.println(person); }

   3. Java对象转换JSON

4. 使用步骤：

   1. 导入jackson的相关jar包
   2. 创建Jackson核心对象 ObjectMapper
   3. 调用ObjectMapper的相关方法进行转换

5. 转换方法：

   • writeValue(参数1,obj):
     参数1：
     File：将obj对象转换为JSON字符串，并保存到指定的文件中
     Writer：将obj对象转换为JSON字符串，并将json数据填充到字符输出流中
     OutputStream：将obj对象转换为JSON字符串，并将json数据填充到字节输出流中
   • writeValueAsString(obj):将对象转为json字符串

6. 代码演示

   1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29

   import cn.yangye.domain.Person; import com.fasterxml.jackson.core.JsonProcessingException; import com.fasterxml.jackson.databind.ObjectMapper; import org.junit.Test; public class JacksonTest { //Java对象转为Json @Test public void test1() throws Exception { //1.创建Person对象 Person p = new Person(); p.setName("刘能"); p.setAge(56); p.setGender("男"); //2.创建Jackson的核心对象 ObjectMapper ObjectMapper mapper = new ObjectMapper(); //3.转换 String json = mapper.writeValueAsString(p); System.out.println(json); //{"name":"刘能","age":56,"gender":"男"} //writeValue将数据写到 E://a.txt文件中 mapper.writeValue(new File("e://a//a.txt"), p); //writeValue将数据关联到write中 mapper.writeValue(new FileWriter("e://a//b.txt"), p); } }

7. 注解：

   1. @JsonIgnore：排除属性。转换时忽略该属性。
   2. @JsonFormat：属性值的格式化
      • @JsonFormat(pattern = "yyyy-MM-dd")

8. 复杂java对象转换

   1. List：数组
   2. Map：对象格式一致
   3. 代码演示
      1. List

         1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32

         public void test3() throws Exception { //1.创建Person对象 Person p = new Person(); p.setName("刘能"); p.setAge(56); p.setGender("男"); p.setBirthday(new Date()); Person p1 = new Person(); p1.setName("赵四"); p1.setAge(56); p1.setGender("男"); p1.setBirthday(new Date()); Person p2 = new Person(); p2.setName("谢广坤"); p2.setAge(56); p2.setGender("男"); p2.setBirthday(new Date()); //创建list集合 ArrayList<Person> list = new ArrayList<>(); list.add(p); list.add(p1); list.add(p2); //转换 ObjectMapper mapper = new ObjectMapper(); String json = mapper.writeValueAsString(list); System.out.println(json); //[{"name":"刘能","age":56,"gender":"男","birthday":"2020-04-13"},{"name":"赵四","age":56,"gender":"男","birthday":"2020-04-13"},{"name":"谢广坤","age":56,"gender":"男","birthday":"2020-04-13"}] }

   2. Map

      1 2 3 4 5 6 7 8 9 10 11 12 13 14

      @Test public void test4() throws Exception { //1.创建map集合 Map<String, Object> map = new HashMap<>(); map.put("name", "赵四"); map.put("age", "56"); map.put("gender", "男"); //转换 ObjectMapper mapper = new ObjectMapper(); String json = mapper.writeValueAsString(map); System.out.println(json); //{"gender":"男","name":"赵四","age":"56"} }

      四、案例

需求：校验用户名是否存在

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48

package cn.yangye.web.servlet; import com.fasterxml.jackson.databind.ObjectMapper; import javax.servlet.ServletException; import javax.servlet.annotation.WebServlet; import javax.servlet.http.HttpServlet; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; import java.io.IOException; import java.util.HashMap; import java.util.Map; @WebServlet("/findUserServlet") public class FindUserServlet extends HttpServlet { protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { //设置响应数据格式为json response.setContentType("application/json;charset=utf-8"); //1.获取用户名 String username = request.getParameter("username"); //2.调用service层判断用户名是否存在 //期望服务器响应会的数据格式：{"userExsit":true,"msg":"此用户已经存在"} // {"userExsit":false,"msg":"用户名可用"} Map<String, Object> map = new HashMap<String, Object>(); if ("tom".equals(username)) { //存在 map.put("userExsit", true); map.put("msg", "此用户已经存在"); } else { //不存在 map.put("userExsit", false); map.put("msg", "用户名可用"); } //将map转为json，并且传递给客户端浏览器 ObjectMapper mapper = new ObjectMapper(); mapper.writeValue(response.getWriter(), map); } protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { this.doPost(request, response); } }

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41

<head> <meta charset="UTF-8"> <title>注册</title> <script src="./js/jquery-3.3.1.min.js"></script> <script> //在页面加载完成后 $(function () { //给username绑定blur事件 $("#username").blur(function () { //获取username文本输入框的值 var username = $(this).val(); //发送ajax请求 //期望服务器响应会的数据格式：{"userExsit":true,"msg":"此用户已经存在"} // {"userExsit":false,"msg":"用户名可用"} $.get("findUserServlet", {username: username}, function (data) { var span = $("#s_username"); //判断userExsit键是否为true if (data.userExsit) { //用户名存在 span.css("color", "red"); span.html(data.msg); } else { //用户名不存在 span.css("color", "green"); span.html(data.msg); } }); }); }); </script> </head> <body> <form> <input type="text" id="username" name="username" placeholder="请输入用户名"> <span id="s_username"></span><br> <input type="text" name="password" placeholder="请输入密码"><br> <input type="submit"><br> </form>

五、注意

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

• 浏览器：$.get(type):将最后一个参数type指定为json
• 服务器：指定MIME类型 application/json
  response.setContentType("application/json;charset=utf-8");