2024年最全json在前后端数据交互中的应用_前后端使用json交互的好处，2024年最新2024年互联网大厂物联网嵌入式开发笔经

本文链接：https://blog.youkuaiyun.com/2401_85014241/article/details/138831244

既有适合小白学习的零基础资料，也有适合3年以上经验的小伙伴深入学习提升的进阶课程，涵盖了95%以上物联网嵌入式知识点，真正体系化！

由于文件比较多，这里只是将部分目录截图出来，全套包含大厂面经、学习笔记、源码讲义、实战项目、大纲路线、电子书籍、讲解视频，并且后续会持续更新

{“name”:“李四”, “age”=20, “address”:{“street”:“湖南”, “city”:“张家界”,“country”:“中国”}}
]


3.还有一种结构

var json={“abc”:[{“name”:“txt1”},{“name”,“txt2”}]};
//这里的json.abc是一个数组，数组是由2个子json组成的

遍历(后面不在讲这种结构）
for(var i=0;i<json1.abc.length;i++){alert(json1.abc[i].name);}


里面的是一个对象{}，如果是多个对象，则用逗号间隔，即{},{}，这样就组成了一个对象序列，为了辨别开始和结束，则需要加上[]才能进行传递，则实际传递的形式应该是[{},{}]，如果只要传递一个对象，则{}的形式就可以了。


### 四.json在前端(js)应用


后端将数据处理成json格式，前端就通过ajax来接收数据，并eval()或者json.prase(data)解析，循环遍历，展现在页面上。

$ .ajax({
url : “myfileAction”,
dataType : “json”,
type : “post”,
success : function(data) {
}
});


**第一步，接收数据**   
 用ajax来接收后端发来的数据，简单说下ajax，ajax是一种用于快速创建动态网页的技术。通过在后台与服务器进行少量数据交换，ajax就可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下，对网页的某部分进行更新。而传统的网页（不使用ajax）如果需要更新内容，必须重载整个网页面。   
 type: “POST”, //请求的方式，也有get请求   
 url: “myfileAction”, //请求地址，后台提供的,填写具体action，也就是struts.xml文件中action名字。   
 data: {name:name},//data是传给后台的json字段，后台需要哪些就传入哪些，这里是接收数据，所以可以不用写。   
 dataType: “json”, //json格式，后台返回的数据为json格式的。


**第二步，解析数据**   
 前后台传输的时候其实是字符串，解析是把json字符串重新变成json类型的对象。


json字符串转换成json对象

var obj = eval(‘(’ + data + ‘)’);
或者 var obj = JSON.parse(data);


区别：eval方法不会去检查给的字符串时候符合json的格式，同时如果给的字符串中存在js代码eval也会一并执行。相比而言eval()不安全，建议用JSON.parse。


json对象转为json字符串

var name = JSON.stringify(person);


前端传入后台的应该是一个json格式的字符串，而不是一个json对象，所以这个也有用的。   
 讲到这里简单提下发送数据吧。


ajax请求的时候也要指定dataType:“json”,contentType:”application/json” 这样就可以轻易的将一个对象或者List传到后端。


**第三步，数据遍历**   
 可以通过jQuery的$.each()方法遍历输出，举个例子


如果声明的是字符串，var arr=’[]’这样类型，那么遍历的时候应该先用json.parse()或者jquery的方法$.parseJSON将字符串转化为对象。


还有一种是for循环遍历

for(var i=0; i<arr.length; i++)
{
alert(arr[i].name+" " + arr[i].value)
}
//取arr数组里一个叫name的值，比如上面name后面值是张三，就取出张三


### 五.json在后端上的应用


在后端action里要导入 net.sf.json.JSONObject这个包。


**第一步，有几种后端数据封装成json数据格式**


1.List集合转换成json代码   
 　List list = new ArrayList();   
 　list.add( “first” );   
 　list.add( “second” );   
 　JSONArray jsonArray = JSONArray.fromObject( list );   
 2. Map集合转换成json代码   
 　Map map = new HashMap();   
 　map.put(“name”, “json”);   
 　map.put(“bool”, Boolean.TRUE);   
 　map.put(“int”, new Integer(1));   
 　map.put(“arr”, new String[] { “a”, “b” });   
 　map.put(“func”, “function(i){ return this.arr[i]; }”);   
 　JSONObject json = JSONObject.fromObject(map);   
 3.Bean转换成json代码   
 　　JSONObject jsonObject = JSONObject.fromObject(new JsonBean());   
 4. 数组转换成json代码   
 　boolean[] boolArray = new boolean[] { true, false, true };   
 　　JSONArray jsonArray1 = JSONArray.fromObject(boolArray);   


**收集整理了一份《2024年最新物联网嵌入式全套学习资料》，初衷也很简单，就是希望能够帮助到想自学提升的朋友。**
![img](https://img-blog.csdnimg.cn/img_convert/1cbb20ad8c73cf92feab52cf0b91047c.png)
![img](https://img-blog.csdnimg.cn/img_convert/bf9e8422f6acb32b4f99d9ce90553808.png)

**[如果你需要这些资料，可以戳这里获取](https://bbs.youkuaiyun.com/topics/618679757)**

**一个人可以走的很快，但一群人才能走的更远！不论你是正从事IT行业的老鸟或是对IT行业感兴趣的新人**

**都欢迎加入我们的的圈子（技术交流、学习资源、职场吐槽、大厂内推、面试辅导），让我们一起学习成长！**

**[如果你需要这些资料，可以戳这里获取](https://bbs.youkuaiyun.com/topics/618679757)**

**一个人可以走的很快，但一群人才能走的更远！不论你是正从事IT行业的老鸟或是对IT行业感兴趣的新人**

**都欢迎加入我们的的圈子（技术交流、学习资源、职场吐槽、大厂内推、面试辅导），让我们一起学习成长！**