json在项目中的应用大总结

Posted 2020-08-02 Una

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了json在项目中的应用大总结相关的知识，希望对你有一定的参考价值。

一、摘要

刚开始接触json的时候，那时候还不太清楚json到底是个什么东西，然后就在项目中使用了它。因为没有搞明白json的本质，所以刚开始使用json的时候走了不少弯路。这次总结一些json的知识，总结主要是想梳理一下自己使用json的一些应用场景，让自己对json有一个更深刻的认识，以后在项目中可以更加熟练的应用它。

二、总结：

1.json在前端中的应用：

a）ajax+json使用场景：

ajax处理登录验证信息解析json格式的String类型对象和ajax获得服务端的响应数据的方式request.responseText

评论处理，用ajax将表单的数据提交给服务端，客户端解析从服务端传过来的json格式的List类型的数据：

用ajax来获取服务器端的数据，如果从服务器传到前端的数据都是JSON的字符串形式，在前端要读取数据，需要先将字符串转化成json格式的对象。

js中的eval（）函数就是将json格式的字符串转化为json格式的对象。

刚开始学习的时候首先学的是原生的ajax，还没有学习jquery（jquery中的ajax更方便），在项目中就用上面的原生的ajax来和服务器进行交互。当前端需要像后台异步请求大量的数据时，必须要有一个方法让我们可以将这些数据方便的从后台传到前端，比如后台要传给前端的数据是一个数组类型的，后台通过相应的方法将这个数组类型的数据转化成json格式的字符串，然后再传给前端，前端为了将从后台获取到的json格式的字符串的内容一个个显示在对应的位置，就需要先将该json格式的字符串转化成json对象（eval函数，实际项目中应该避免使用eval），然后才能一个个的将数据读取出来（第二张图中遍历获取到的后台数据）。

刚开始如果对json不熟悉，可能会遇到不知道如何读取从后台传到前端的json格式的字符串的情况。这个时候就要搞清楚json的概念。（要在实际中应用json，要掌握json格式数据的写法以及如何读取json格式的数据）。

2.json基础：

a）了解json概念：

b)了解json语法：

地址：http://www.w3school.com.cn/json/json_syntax.asp

1.json值：

2.json对象写法：{ "firstName":"John" , "lastName":"Doe" }
3.json数组写法（可包含多个json对象）：

var employees = [
{ "firstName":"Bill" , "lastName":"Gates" },
{ "firstName":"George" , "lastName":"Bush" },
{ "firstName":"Thomas" , "lastName": "Carter" }
];

读取json数组的方式：
employees[0].lastName;//获取第一项json对象的lastName属性的值
for（var i=0;i<employees.length;i++）{//js中遍历json数组中的所有的值
  alert( employees[i].firstName);
  alert( employees[i].lastName);
}

var a={
"employees": [
{ "firstName":"John" , "lastName":"Doe" },
{ "firstName":"Anna" , "lastName":"Smith" },
{ "firstName":"Peter" , "lastName":"Jones" }
]
}
a.employees[0].lastName;//获取employees第一项json对象的lastName属性的值

c)搞清楚json对象和json字符串的区别(后面总结)

3.jquery中的ajax+json（项目中用的最多的）：
学了jquery之后，实际应用中经常用的当然是用jquery中的ajax来向服务器发送请求了

a)jquery的ajax基础用法：
获取表单信息，并将该信息传给服务器，服务器像前端返回json数组对象，前端获取之后读取该json数组对象（图片中描述不准确，补充：返回的是对象就可以直接遍历）
表单数据少时，可以采用直接像下面这样获取表单数据之后传递给服务器
实例一：

实例二：服务器只向前端传了一个数值类型的数据（直接输出data就可以得到该值，因为json的值可以是数值，用data[0]一样可以的得到）