json从入门到精通(全)
Posted 码农研究僧
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了json从入门到精通(全)相关的知识,希望对你有一定的参考价值。
前言
这篇文章参考了狂神对json的理解,以及融合了自已对json数据的理解做出的笔记
【狂神说Java】一小时掌握JSON
在学习这部分知识点的时候
需要了解一些知识点
前端掌握基本的ajax、jquery的框架知识,后端掌握springmvc的框架
两者结合在一起,就大概知道json格式的数据怎么传输
现在大多数的网址都是局部刷新
不刷新整个页面的情况下实现页面的局部刷新
前端实现跳转显示,但是请求都在后端实现的。最重要的一个因素就是ajax请求
- JavaScript从入门到精通(全)
- Ajax从入门到精通(全)
- jQuery从入门到精通(全)
- SpringMVC从入门到精通(全)(基于spring的一个框架,是spring的一个部件,做web的一个框架)
1. 入门知识
- JSON 是一种轻量级的
文本数据交换格式
(有固定格式的字符串) - 服务任何语言,
C、C++、Java、Objective-C、Python、Go、
等。由于各个语言都支持 JSON ,JSON 又支持各种数据类型,所以JSON常用于我们日常的 HTTP 交互、数据存储等
花括号保存对象。键值对数据结构,以 “” 开始,以 “” 结束。中间包裹的为Key : Value的数据结构
方括号保存数组。数组数据结构如上图,以 “[” 开始,以 “]” 结束。Value可以为String、number、object、array、boolean(true/false),null
这几种数据类型
以上常见的json格式具体有:
"key":"value"
,最简单的JSON 格式。"key1":"value1","key2":"value2"
,一个JSON中有多个键值对的表达方式。"key":["a","b","c"]
,value是一个Array 的JSON格式。"json":["码农","研究僧",true,1,null]
,value是一个数组的JSON格式,并且这个数组中有多重类型的元素,有String,Boolean,Number,null。"key":"码农":"研究僧"
,value 是json格式。
如果上面的json数据比较凌乱,可通过json的格式化进行美化
百度直接搜json的格式化可以自动将其美化
关于json的好处:
-
各个语言、各个框架(第三方组件)都支持JSON,复用率更高
-
体积小、解析速度快
2. 结合javascript
JSON 是 JavaScript 对象的字符串表示法,它使用文本表示一个 JS 对象的信息,本质是一个字符串。
var obj = a: 'Hello', b: 'World'; //一个对象,键名可以使用单双引号都可
var json = '"a": "Hello", "b": "World"'; //一个 JSON 字符串,本质是一个字符串
其定义的格式
如果通过javascript中获取,格式如下:
//定义一个对象
var obj =
"name": "码农研究僧",
"age": 22
//取出对象的name
alert("name:" + obj.name);
//取出对象的age。
alert("age:" + obj.age);
2.1 eval函数
如果通过json数据格式转换成JavaScript,具体如下:
通过eval函数,但是该函数是运算之后的格式,如果内容中有运算符(/、*、-、+、>>等)
会出错
var txtJson = ' "star_male" : [' +
' "name":"码农" , "age":22 ,' +
' "name":"研究僧" , "age":23 ]';
//利用函数 eval() 转换成JSON对象
var obj = eval ("(" + txtJson + ")");
//输出数组的第一个对象的name值
alert("得到的值:" + obj.star_male[0].name);
2.2 parse()和stringify()函数
- JSON字符串转换为JavaScript 对象,使用 JSON.parse()
- JavaScript 对象转换为JSON字符串,使用 JSON.stringify() 方法
<script type="text/javascript">
//编写一个js的对象
var user =
name:"码农研究僧",
age:22,
sex:"男"
;
//将js对象转换成json字符串
var str = JSON.stringify(user);
console.log(str);
//将json字符串转换为js对象
var user2 = JSON.parse(str);
console.log(user2.age,user2.name,user2.sex);
</script>
3. 结合ajax
原生的JavaScript来写一个Ajax
提交JSON数据,后端要以JSON方式接收,另外前端要采用POST提交方式
前端发送给后端的json格式数据
request的请求格式具体有三个:
- 请求方式,常用可选为 GET/POST,还有DELETE、UPDATE、OPTIONS等
- 请求的链接,可以是相对路径和绝对路径。
- 同步还是异步,true为异步,false为同步
发送请求可以是get和post
- get的请求方式:
request.send();
- POST请求方式:可以传参,可以是字符型的JSON或者 ?和 &方式如下:
request.send("name=码农研究僧&age=23");
ajax传递json的数据格式到服务器
//1.创建ajax request对象
var request = new XMLHttpRequest();
//2.绑定监听回调函数
request.onreadystatechange = function()
//判断返回状态是否正常
if(request.readyState ===4 &&request.status === 200)
//6.接收数据
var res = request.responseText;
//输出数据
console.log('返回值',res);
else
//错误
console.log('error');
;
//3.
request.open("POST","json格式编码网址",true);
//4.
request.setRequestHeader("Content-type","application/x-www-form-urlencoded");
//5.发送请求.post方式如果后端接受不到参数,请把请求头改成 "Content-type","application/json"
//发送JSON数据
request.send('"name":"码农研究僧","age":23');
具体jison格式为如下:
"Name": "码农研究僧",
"Info": "测试json"
服务器接收到json的数据格式厚,回显到前端服务器显示出来
//1.创建ajax request对象
var request = new XMLHttpRequest();
//2.绑定监听回调函数
request.onreadystatechange = function()
//判断返回状态是否正常
if(request.readyState ===4 &&request.status === 200)
//6.接收数据
var res = request.responseText;
//输出数据
console.log('返回值',res);
/**
* 如果返回来的参数是JSON,就可以直接转换。
*/
var json = JSON.parse(res);
console.log('Name:',json.Name);
console.log('Info:',json.Info);
else
console.log('error');
;
request.open("GET","json格式编码网址",true);
request.setRequestHeader("Content-type","application/x-www-form-urlencoded");
//5.发送请求GET请求方式:request.send();
request.send();
4. 结合jquery
jQuery是对JavaScript的封装的产物,丰富的选择器,优雅的Ajax写法。一个是jQuery的选择器,另外一个就是ajax的封装了
jQuery的常用参数:
名称 | 类型 | 规则说明 |
---|---|---|
url | string | 请求连接,可以是相对路径或者是绝对路径。 |
cache | Boolean | 是否缓存,默认true,false为不缓存。 |
type | string | 请求方式,get、post、put、delete、update、option。 |
data | String/JSON | 请求的参数,可以是&拼接的方式或者JSON对象提交方式 |
dataType | string | 预期返回的类型,可选值有,json、xml、html、script、jsonp、text |
success | Function | 成功回调的方法。 |
error | Function | 失败调用的方法。 |
具体jison格式为如下:
"Name": "码农研究僧",
"Info": "测试json"
$.ajax(
url:"json数据的网址",
type:"get",
data:"name":"码农研究僧","age":22,
dataType:'json',
success:function (json)
console.log('Name:',json.Name);
console.log('Info:',json.Info);
,
error:function (e)
//错误信息
console.log(e.message);
);
通过jQuery$.get
、$.post
、$.getJSON
$.get("json数据的网址",
"name":"码农研究僧","age":22, //没有参数的时候,直接省略或者以直接写null/
function (json)
console.log('Name:',json.Name);
console.log('Info:',json.Info);
,
'json' //只有get post的时候需要,其他getJSON可以省略,默认就是json
);
5. 结合springmvc
json解析工具:Jackson
导入它的jar包
<!-- https://mvnrepository.com/artifact/com.fasterxml.jackson.core/jackson-databind -->
<dependency>
<groupId>com.fasterxml.jackson.core</groupId>
<artifactId>jackson-databind</artifactId>
<version>2.13.1</version>
</dependency>
还有springmvc的配置文件
主要配置其视图解析器、中文字符编码过滤器以及web配置网页
<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns="http://xmlns.jcp.org/xml/ns/javaee"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-app_4_0.xsd"
version="4.0">
<!--1.注册servlet-->
<servlet>
<servlet-name>SpringMVC</servlet-name>
<servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class>
<!--通过初始化参数指定SpringMVC配置文件的位置,进行关联-->
<init-param>
<param-name>contextConfigLocation</param-name>
<param-value>classpath:springmvc-servlet.xml</param-value>
</init-param>
<!-- 启动顺序,数字越小,启动越早 -->
<load-on-startup>1</load-on-startup>
</servlet>
<!--所有请求都会被springmvc拦截 -->
<servlet-mapping>
<servlet-name>SpringMVC</servlet-name>
<url-pattern>/</url-pattern>
</servlet-mapping>
<filter>
<filter-name>encoding</filter-name>
<filter-class>org.springframework.web.filter.CharacterEncodingFilter</filter-class>
<init-param>
<param-name>encoding</param-name>
<param-value>utf-8</param-value>
</init-param>
</filter>
<filter-mapping>
<filter-name>encoding</filter-name>
<url-pattern>/</url-pattern>
</filter-mapping>
</web-app>
<?xml version="1.0" encoding="UTF-8"?>
<beans xmlns="http://www.springframework.org/schema/beans"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xmlns:context="http://www.springframework.org/schema/context"
xmlns:mvc="http://www.springframework.org/schema/mvc"
xsi:schemaLocation="http://www.springframework.org/schema/beans
http://www.springframework.org/schema/beans/spring-beans.xsd
http://www.springframework.org/schema/context
https://www.springframework.org/schema/context/spring-context.xsd
http://www.springframework.org/schema/mvc
https://www.springframework.org/schema/mvc/spring-mvc.xsd">
<!-- 自动扫描指定的包,下面所有注解类交给IOC容器管理 -->
<context:component-scan base-package="com.controller"/>
<!-- 视图解析器 -->
<bean class="org.springframework.web.servlet.view.InternalResourceViewResolver"
id="internalResourceViewResolver">
<!-- 前缀 -->
<property name="prefix" value="/WEB-INF/jsp/" />
<!-- 后缀 -->
<property name="suffix" value=".jsp" />
</bean>
</beans>
为了测试json的数据格式
还需要一个实体类,主要为了传一些参数进去
import lombok.AllArgsConstructor;
import lombok.Data;
import lombok.NoArgsConstructor;
//需要导入lombok
@Data //帮助实现get和set的一些参数
@AllArgsConstructor //全参
@NoArgsConstructor //空参
public class User
private String name;
private int age;
private String sex;
界面层的代码模块具体如下:
@ResponseBody
将服务器返回的对象转换为json对象响应回去
@RestController
=@ResponseBody
+@Controller
@Controller //
public class UserController
@RequestMapping("/json1")
@ResponseBody
public String json1() throws JsonProcessingException
//创建一个jackson的对象映射器,用来解析数据
ObjectMapper mapper = new ObjectMapper();
//创建一个对象
User user = new User("码农研究僧", 22, "男");
//将我们的对象解析成为json格式
String str = mapper.writeValueAsString(user);
//由于@ResponseBody注解,这里会将str转成json格式返
return str;
这样会出现乱码,解决乱码的问题有很多种方法,一种是直接添加参数修改,一种是在配置文件修改
- 第一种方法:
@RequestMapping(value = "/json1",produces = "application/json;charset=utf-8")
,produces:指定响应体返回类型和编码 - 第二种方法添加utf-8过滤器
<mvc:annotation-driven>
<mvc:message-converters register-defaults="true">
<bean class="org.springframework.http.converter.StringHttpMessageConverter">
<constructor-arg value="UTF-8"/>
</bean>
<bean class="org.springframework.http.converter.json.MappingJackson2HttpMessageConverter">
<property name="objectMapper">
<bean class="org.springframework.http.converter.json.Jackson2ObjectMapperFactoryBean">
<property name="failOnEmptyBeans" value="false"/>
</bean>
</property>
</bean>
</mvc:message-converters>
</mvc:annotation-driven>
还有一点。类上直接使用 @RestController
,就不用在每个方法中都添加这个注@ResponseBody
补充一下如果输出时间的json的格式化
如果不外加时间戳的方式,输出就是默认输出时间戳的形式
@RequestMapping("/json4")
public String json4() throws JsonProcessingException
ObjectMapper mapper = new ObjectMapper();
//不使用时间戳的方式
mapper.configure(SerializationFeature.WRITE_DATES_AS_TIMESTAMPS, false);
//自定义日期格式对象
SimpleDateFormat sdf = new SimpleDateFormat("yyyy-MM-dd HH:mm:ss");
//指定日期格式
mapper.setDateFormat(sdf);
Date date = new Date();
String str = mapper.writeValueAsString(date);
return str;
以上是关于json从入门到精通(全)的主要内容,如果未能解决你的问题,请参考以下文章
ROS从入门到精通系列(十八)-ROS TF(中)TF 消息全解析