JSON总结（以及前后端交互举例）
⼀、JSON的语法规则
1. [ ] 表⽰数组；
2. { }表⽰对象；
3. 并列的数据之间⽤逗号（,）分隔；
4. 映射（键值对）⽤冒号（:）表⽰；
5. 6种类型 （对象、数组、字符串、数字、布尔值、null）
⼏种JSON格式举例如下：
[“one”, “two”, “three”] //数组
mysql培训怎么样
{ “one”: 1, “two”: 2, “three”: 3 }//对象，注意成员名称必须⽤双引号
{“names”: [“张三”, “李四”] }//值为复合对象
[ { “name”: “张三”}, {“name”: “李四”} ]//对象数组
6. JSON字符串必须使⽤双引号（单引号会报错）
7. 数组或对象的最后⼀个成员后⾯不能加逗号python请求并解析json数据>jsapply方法
8. 字符集必须是UTF-8
⼆、JSON对象
（1）JSON对象简介
1. JSON对象是⼀个键值对的⽆序集合，如：{key:value}
2. Map map和json都是键值对，不同的是map中键值对中间⽤等号分开，json中键值对中间⽤冒号分开。Map <String,String>map=new JSONObject();
（2）JSON对象序列化（把js对象序列化为JSON字符串>>stringify()）
举例1：
var student= {
name: '⼩⽩',
age: 18,
gender: true,
teachers:["lily"],
grade: null,
'middle-school': '\"W3C\" Middle School',
skills: ['JavaScript', 'Java', 'Python']
};
//输出
console.log(JSON.stringify(student));
//按缩进输出
console.log(JSON.stringify(student,null, '  '));
输出：
"{"name":"⼩⽩","age":18,"gende r":true,"teachers":["lily"],"grade":null,"middle-school":"\"W3C\" Middle School","skills":["JavaScript","Java","Python"]}按缩进输出：
"teachers": [
"lily"
],
"grade": null,
"middle-school": "\"W3C\" Middle School",
"skills": [
"JavaScript",
"Java",
"Python"
]
}"
举例2：
输出指定的属性（第⼆个参数，可以传⼊数组）俄罗斯战机
//输出指定的属性
console.log(JSON.stringify(student, ['name', 'skills'], '  '))；输出：
"{
"name": "⼩⽩",
"skills": [
"JavaScript",
"Java",
"Python"
]
matlab软件电脑安装教程
}"
举例3：
输出处理过的属性（第⼆个参数，可以传⼊函数）
//输出处理过的属性（第⼆个参数，可以传⼊函数）
function convert(key, value) {
if (typeof value === 'string') {
UpperCase();
}
return value;
}
console.log(JSON.stringify(student, convert, '  '));
输出：
"teachers": [
"LILY"
],
"grade": null,
"middle-school": "\"W3C\" MIDDLE SCHOOL",
"skills": [
"JAVASCRIPT",
"JAVA",
"PYTHON"
]
}"
举例4：
定义⼀个toJSON()的⽅法
var student= {
name: '⼩⽩',
age: 18,
gender: true,
teachers:["lily"],
grade: null,
'middle-school': '\"W3C\" Middle School',
skills: ['JavaScript', 'Java', 'Python'],
toJSON: function() {
return {            // 只输出name和age，并且改变了key：
'StudentName': this.name,
'StudentAge': this.age
};
}
};
console.log(JSON.stringify(student,null,' '))
输出：
"{
"StudentName": "⼩⽩",
"StudentAge": 18
}"
（3）JSON反序列化（JSON格式的字符串，转变成⼀个JavaScript对象）
//parse()⽅法
JSON.parse('[1,2,3,true]');        // Array [1, 2, 3, true]
JSON.parse('{"name":"⼩明","age":14}');  // Object {name: '⼩明', age: 14}
JSON.parse('true'); // true
JSON.parse('123.45'); // 123.45
JSON.parse('{"name":"⼩明","age":14}', function(key, value) {
if (key === 'name') {
return value + '同学';
}
return value;
});    // Object {name: '⼩明同学', age: 14}
//eval⽅法
var str='{"name":"⼩明","age":14}'
eval('(' + str + ')');// Object {"name":"⼩明","age":14}
（4）JSON访问值
多线程游戏1.访问数组类型
var items = ['item1','item2','item3'];
alert(items[0]);    // item1 
2.访问对象类型
var oExample = { "name":"lily" };
alert(oExample.name);    // lily
alert(oExample["name"]);    // lily　
(5)JSON的前后端交互
⼀、前台传到后端
⽅式⼀：AJAX
(1)将要传⼊后台的数据组装成JSON格式的字符串
var data = [{'name':'jim' , 'age':20} , {'name':'king' ,'age':26},{'name':'jge' , 'age':30}];
var jsonString = JSON.stringify(data);
(2)ajax请求向后台传数据
$.ajax({
type: "post",
url: url,
dataType : 'json',
data : {'mydata':jsonString},
success: function(data,textStatus){
alert("操作成功");
},
error: function(xhr,status,errMsg){
alert("操作失败!");
}
});
(3)后台接收数据并解析
String jsonString = request().getParameter("mydata");
// string转为JSONArray，从array中获取到JSONObject
JSONArray jsonArray = JSONArray.fromObject(jsonString);
for(int i = 0;i < jsonArray.length(); i++) {
JSONObject jsonObj = JSONObject(i);
}
⽅式⼆：原⽣XMLHttp发送
（1）前端发送：
function login() {
var username =ElementById("username").value;
var password = ElementById("password").value;
var remember =ElementById("remember").checked;
var xmlhttp;
if (window.XMLHttpRequest)
{
// IE7+, Firefox, Chrome, Opera, Safari 浏览器执⾏代码
xmlhttp=new XMLHttpRequest();
}
else
{
// IE6, IE5 浏览器执⾏代码
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
{
if (adyState===4 && xmlhttp.status===200)
{
.
..
}
};
xmlhttp.open("POST","/flask/login",true);
xmlhttp.setRequestHeader("Content-type","application/json");
// 后⾯这两部很重要，我看⽹上很多都是使⽤      xmlhttp.send("username="+username+"&password="+")，这样接收还要解析⼀番感觉还是直接发送以下格式的var data = {
"username": username
"password": password
"remember": remember
};
var data_json = JSON.stringify(data);
xmlhttp.send(data_json);
}
（2）后台解析和上个⽅法类似
（3）前端接受响应信息并解析：
var text = sponseText;
// 通过eval() ⽅法将json格式的字符串转化为js对象，并进⾏解析获取内容
var result = eval("("+text+")");
if (result) {
} else {
alert("请输⼊正确的⽤户名和密码");
}
⼆、后台响应到前端

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。