[Javaweb]JSON

2022 年 9 月 19 日
黑龙江
本文字数：3223 字
阅读完需：约 11 分钟

JSON 概述

JSON: JavaScript Object Notation（JavaScript 对象标记法）。

JSON 是一种存储和交换数据的语法。
JSON 是一种轻量级的数据交换格式
JSON 是通过 JavaScript 对象标记法书写的文本。
JSON 使用 JavaScript 语法，但是 JSON 格式是纯文本的。
文本可被任何编程语言作为数据来读取和使用。
JSON 格式最初由 Douglas Crockford 提出。

如下是 JavaScript 对象的定义格式：

{  name:"zhangsan",  age:23,  city:"北京"}

复制代码

接下来我们再看看 JSON 的格式：

{  "name":"zhangsan",  "age":23,  "city":"北京"}

复制代码

通过上面 js 对象格式和 json 格式进行对比，发现两个格式特别像。只不过 js 对象中的属性名可以使用引号（可以是单引号，也可以是双引号）；而 json 格式中的键要求必须使用双引号括起来，这是 json 格式的规定。

交换数据当数据在浏览器与服务器之间进行交换时，这些数据只能是文本。JSON 属于文本，并且我们能够把任何 JavaScript 对象转换为 JSON，然后将 JSON 发送到服务器。我们也能把从服务器接收到的任何 JSON 转换为 JavaScript 对象。以这样的方式，我们能够把数据作为 JavaScript 对象来处理，无需复杂的解析和转译。

JSON vs XML

==JSON 和 XML 均可用于从 web 服务器接收数据。==下面的 JSON 和 XML 实例都定义了雇员对象，包含了由 3 个雇员构成的数组：

JSON 实例：

{"employees":[    { "firstName":"Bill", "lastName":"Gates" },    { "firstName":"Steve", "lastName":"Jobs" },    { "firstName":"Elon", "lastName":"Musk" }]}

复制代码

XML 实例：

<employees>    <employee>         <firstName>Bill</firstName>         <lastName>Gates</lastName>     </employee>     <employee>         <firstName>Steve</firstName>         <lastName>Jobs</lastName>     </employee>     <employee>         <firstName>Elon</firstName>         <lastName>Musk</lastName>     </employee></employees>

复制代码

JSON 类似 XML，因为:

JSON 和 XML 都是“自描述的”（人类可读的）
JSON 和 XML 都是分级的（值中有值）
JSON 和 XML 都能被大量编程语言解析和使用
JSON 和 XML 都能被 XMLHttpRequest 读取

JSON 与 XML 的差异在于：

JSON 不使用标签
JSON 更短
JSON 的读写速度更快
JSON 可使用数组

最大的不同在于：

XML 必须使用 XML 解析器进行解析。而 JSON 可通过标准的 JavaScript 函数进行解析。

为什么 JSON 比 XML 更好？

XML 比 JSON 更难解析。
JSON 被解析为可供使用的 JavaScript 对象。

对于 AJAX 应用程序，JSON 比 XML 更快更易用：

JSON 基础语法

JSON 本质就是一个字符串，但是该字符串内容是有一定的格式要求的。定义格式如下：

var 变量名 = '{"key":value,"key":value,...}';

复制代码

JSON 串的键要求必须使用双引号括起来，而值根据要表示的类型确定。value 的数据类型分为如下

数字（整数或浮点数）
字符串（使用双引号括起来）
逻辑值（true 或者 false）
数组（在方括号中）
对象（在花括号中）
null

在前端实现 JSON 数据和 JS 对象的转换

创建一个页面，在该页面的 <script> 标签中定义 json 字符串

<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title>Title</title></head><body><script>    //1. 定义JSON字符串    var jsonStr = '{"name":"zhangsan","age":23,"addr":["北京","上海","西安"]}'    alert(jsonStr);
</script></body></html>

复制代码

通过浏览器打开，页面效果如下图所示

现在我们需要获取到该 JSON 串中的 name 属性值，应该怎么处理呢？

如果它是一个 js 对象，我们就可以通过 js对象.属性名 的方式来获取数据。JS 提供了一个对象 JSON ，该对象有如下两个方法：

parse(str) ：将 JSON 串转换为 js 对象。使用方式是： ==var jsObject = JSON.parse(jsonStr);==
stringify(obj) ：将 js 对象转换为 JSON 串。使用方式是：==var jsonStr = JSON.stringify(jsObject)==

代码演示：

<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title>Title</title></head><body><script>    //1. 定义JSON字符串    var jsonStr = '{"name":"zhangsan","age":23,"addr":["北京","上海","西安"]}'    alert(jsonStr);
    //2. 将 JSON 字符串转为 JS 对象    let jsObject = JSON.parse(jsonStr);    alert(jsObject)    alert(jsObject.name)    //3. 将 JS 对象转换为 JSON 字符串    let jsonStr2 = JSON.stringify(jsObject);    alert(jsonStr2)</script></body></html>

复制代码

使用 Axios 发送 JSON 数据

后面我们使用 axios 发送请求时，如果要携带复杂的数据时都会以 JSON 格式进行传递，如下

axios({    method:"post",    url:"http://localhost:8080/ajax-demo/axiosServlet",    data:"username=zhangsan"}).then(function (resp) {    alert(resp.data);})

复制代码

请求参数不可能由我们自己拼接字符串吧？肯定不用，可以提前定义一个 js 对象，用来封装需要提交的参数，然后使用 JSON.stringify(js对象) 转换为 JSON 串，再将该 JSON 串作为 axios 的 data 属性值进行请求参数的提交。如下：

var jsObject = {name:"张三"};
axios({    method:"post",    url:"http://localhost:8080/ajax-demo/axiosServlet",    data: JSON.stringify(jsObject)}).then(function (resp) {    alert(resp.data);})

复制代码

而 axios 是一个很强大的工具。我们只需要将需要提交的参数封装成 js 对象，并将该 js 对象作为 axios 的 data 属性值进行，它会自动将 js 对象转换为 JSON 串进行提交。如下：

var jsObject = {name:"张三"};
axios({    method:"post",    url:"http://localhost:8080/ajax-demo/axiosServlet",    data:jsObject  //这里 axios 会将该js对象转换为 json 串的}).then(function (resp) {    alert(resp.data);})

复制代码

==注意：==
js 提供的 JSON 对象我们只需要了解一下即可。因为 axios 会自动对 js 对象和 JSON 串进行想换转换。
发送异步请求时，如果请求参数是 JSON 格式，那请求方式必须是 POST。因为 JSON 串需要放在请求体中。

在后端实现 JSON 数据和 Java 对象转换

以后我们会以 json 格式的数据进行前后端交互。前端发送请求时，如果是复杂的数据就会以 json 提交给后端；而后端如果需要响应一些复杂的数据时，也需要以 json 格式将数据响应回给浏览器。

在后端我们就需要重点学习以下两部分操作：

请求数据：JSON 字符串转为 Java 对象
响应数据：Java 对象转为 JSON 字符串

接下来给大家介绍一套 API，可以实现上面两部分操作。这套 API 就是 Fastjson

Fastjson 使用

Fastjson 使用也是比较简单的，分为以下三步完成

导入坐标

   <dependency>       <groupId>com.alibaba</groupId>       <artifactId>fastjson</artifactId>       <version>1.2.62</version>   </dependency>

复制代码

Java 对象转 JSON

   String jsonStr = JSON.toJSONString(obj);

复制代码

将 Java 对象转换为 JSON 串，只需要使用 Fastjson 提供的 JSON 类中的 toJSONString() 静态方法即可。

JSON 字符串转 Java 对象

   User user = JSON.parseObject(jsonStr, User.class);

复制代码

将 json 转换为 Java 对象，只需要使用 Fastjson 提供的 JSON 类中的 parseObject() 静态方法即可。

使用案例

public class FastJsonDemo {
    public static void main(String[] args) {        //1. 将Java对象转为JSON字符串        User user = new User();        user.setId(1);        user.setUsername("zhangsan");        user.setPassword("123");
        String jsonString = JSON.toJSONString(user);        System.out.println(jsonString);//{"id":1,"password":"123","username":"zhangsan"}

        //2. 将JSON字符串转为Java对象        User u = JSON.parseObject("{\"id\":1,\"password\":\"123\",\"username\":\"zhangsan\"}", User.class);        System.out.println(u);    }}

复制代码

结果：

发布于: 刚刚阅读数: 4

原文链接:【http://xie.infoq.cn/article/ac1d7f1b6851ef84e6eae9d6e】。未经作者许可，禁止转载。

fake smile by

关注

还未添加个人签名 2022.07.31 加入

还未添加个人简介

发布

暂无评论

创作场景

[Javaweb]JSON

JSON 概述

JSON vs XML

JSON 基础语法

在前端实现 JSON 数据和 JS 对象的转换

使用 Axios 发送 JSON 数据

在后端实现 JSON 数据和 Java 对象转换

Fastjson 使用

使用案例

fake smile by

评论