一、对于JSON的理解：
JSON，大部分都是用来处理JavaScript和web服务器端之间的数据交换，把后台web服务器的数据传递到前台，然后使用JavaScript进行处理，例如ajax等。
JSON，就是一种数据传输格式而已，无它，非常容易掌握。但是大家不要误以为JSON最大的用处是在前端，其实JSON最大的用处是处理JavaScript和web服务器端之间数据交换。
二、json结构：
//无论是json对象还是json数组中，其中的键名可以不带 ” ”
//并且嵌套结构中，嵌套的对象名字可以带 ” “，也可以不带
1、对象结构
var jsonObj_1 =
{
"键名1":值1,
"键名2":值2,
……
"键名n":值n,
jsonObj_2:{
"键名1":值1,
"键名2":值2,
……
"键名n":值n
}
}
//注意，这里的键名是字符串，但是值可以是数值、字符串、对象、数组或逻辑true和false。且对象之间可以嵌套
2、数组结构
var arr =
[
{
"键名1":值1,
"键名2":值2
},
{
"键名3":值3,
"键名4":值4
},
……
]
//数组结构是以“[”开始，到“]”结束，这一点跟JSON对象不同。不过在JSON数组结构中，每一对“{}”相当于一个JSON对象
//键名是字符串，但是值可以是数值、字符串、对象、数组或逻辑true和false。
三、读写操作
1、json对象
1>读：
jsonObj.key
jsonObj["key"]
//key指的是键名。读取JSON数据使用的是“.”操作符
//例：
obj{
"name":"xyy"
}
obj.name或obj["name"]
2>写入或者修改
jsonObj.key = 值;
jsonObj["key"] = 值;
//例：obj.name="xyy";或obj["name"]="xyy";
2、json数组
1>读
arr[index].key;
或
arr[index]["key"];
2>写入或修改
arr[index].key=值;
arr[index]["key"]=值;
四、添加元素
1、json对象：
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script type="text/javascript" src="jquery.min.js"></script>
<script type="text/javascript">
$(function () {
var arr={};//定义一个json对象
console.log("添加前");
console.log(arr);
$("#btn").click(function(){
arr.name=$("#names").val();
arr['value']=$("#values").val();//直接定义出json对象中的键名，无需用什么函数啥的
console.log("添加后");
console.log(arr);
})
//注意：因为定义的是一个json对象，所以无论怎么输入其他的数据，都会覆盖原来的数据，即只存在一个对象
})
</script>
</head>
<body>
<input id="names" type="text" value="" placeholder="name" />
<input id="values" type="text" value="" placeholder="value" />
<input type="button" id="btn" value="提交"/>
</body>
</html>
2、json数组：
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script type="text/javascript" src="jquery.min.js"></script>
<script type="text/javascript">
$(function () {
var arr=[];//定义空的json数组
console.log("添加前");
console.log(arr);
$("#btn").click(function(){
var json={'name':$("#names").val(),'value':$("#values").val()};//定义即将添加的对象
arr.push(json);//应用数组函数push()将json对象加入
console.log("添加后");
console.log(arr);
})
})
</script>
</head>
<body>
<input id="names" type="text" value="" placeholder="name" />
<input id="values" type="text" value="" placeholder="value" />
<input type="button" id="btn" value="提交"/>
</body>
</html>
五、删除json中的数据
1、json对象
delete jsonObj.key;
或
delete jsonObj["key"];
2、json数组
delete arr[index];
//删除数组中的某一对象
delete arr[index].key;
delete arr[index]["key"];
//删除数组中某一对象的某一项
六、遍历
1、json对象
var obj =
{
"name":"xyy",
"age":21,
"gender":"男",
}
for(var c in obj)
//c是键名变量，是字符串
{
if(c=="name")
{
document.write("姓名是："+obj[c]);
}
}
//变量c是字符串，因此不能使用obj.c来获取JSON数据，而必须使用obj[c]来获取JSON数据。
2、json数组
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script type="text/javascript">
var arr =
[
{
"name":"小明",
"age":23,
"gender":"男"
},
{
"name":"小红",
"age":21,
"gender":"女"
}
]
for(var x in arr)
{//此处x是数字
document.write("这是"+x+"<br/>");
for(var y in arr[x])
{//此处y是字符串
document.write(y+"<br/>")
document.write(arr[x][y]+"<br/>")
}
}
</script>
</head>
<body>
</body>
</html>
六、json字符串与json对象之间的转换
//因为当前端与后台发生交互的时候，传递的都是字符串，而不是对象，所以会涉及到json方面的字符串与对象之间的转变
区分：
json对象：var jsonObj = {"name":"helicopter","age":23,"gender":"男"};
json字符串：var jsonStr = '{"name": "helicopter", "age":23, "gender": "男"}';
//json字符串也是一种字符串，只不过格式符合json格式
转换：
1、json对象->json字符串
JSON.stringify(JSON对象名);
例：
var obj =
{
"name":"helicopter",
"age":23,
//JSON对象内部也有一个JSON对象
hobby:
{
"first":"swimming",
"second":"singing",
"third":"dancing"
}
}
var jsonStr=JSON.stringify(obj);
//此时jsonStr就是json字符串，这时就可以将里面的括号，键值对全部以字符的形式显示出来
2、json字符串->json对象
JSON.parse(字符串名);
例：
var jsonStr = '{"name": "helicopter", "age":23, "gender": "男"}';
var jsonObj=JSON.parse(jsonStr);
//此时jsonObj就是json对象
4503
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
