json对象,json字符串,不注意的话,很容易忽视混淆。例举几个容易混的情况
1,php将变量放到input框中,通过js去读取出来的是json字符串,要想使用就要将json字段串转成json对象
2,ajax返回json数据,如果请求没有设置dataType为json,这个时候得到也是json字符串
3,通过js改变input的value值,如果直接json对象,赋值的话,用开发者工具看到的值会是这样的,[Object Object]
一,json字符串,json对象区别
var aa = '{"test":1,"test1":2}';
var bb = {"test":1,"test1":2};
console.log(bb); //结果为 Object { test=1, test1=2}
console.log(aa); //结果为 {"test":1,"test1":2}
区别就是,一个是对象,一个是字符串,哈哈。
二,json字符串转json对象
var obj = eval('(' + aa + ')'); //方法1
var obj = JSON.parse(aa); //方法2
三,json对象转json字符串
var last=JSON.stringify(obj);
上面的转换,我只加载了,jquery
例子
<!DOCTYPE html>
<html>
<head>
<title>json-demo</title>
</head>
<body>
<textarea id="textarea1" value="" style="width: 500px;height: 300px;"></textarea>
</body>
<script type="text/javascript" src="jquery-1.9.1.min.js"></script>
<script type="text/javascript" src="json2.js"></script>
<script type="text/javascript">
<!--
$(document).ready(function(){
test1();
});
function test1(){
// 简单字符串转换为json对象
var str = '{ "label": "aa", "value": "bb" }';
var obj = JSON.parse(str);
show(obj.label);
// 较复杂的json字符串书写格式
var str2 = '{' +
'"chart":{' +
'"xAxisName":"dd",' +
'"yAxisName":"ee"' +
'},"data":[]' +
'}';
var obj2 = JSON.parse(str2);
// 查找json对象
show(obj2.chart.xAxisName);
// 修改json对象
obj2.chart.xAxisName = "dddd";
show(obj2.chart.xAxisName);
// 删除json对象
delete obj2.chart.xAxisName;
show(obj2.chart.xAxisName);
var elemSet;
// js操作json对象
for(var i=0; i<2 ;i++){
elemSet = {"label":i*2,"value":i*10,"color":"76A5DB"};
// 增加json对象中的data集合元素
obj2.data.push(elemSet);
}
show(obj2.data[0].label+','+obj2.data[0].value+','+'obj2.data[0].color');
// 将json对象转换为字符串
show(JSON.stringify(obj2));
}
function show(text){
var input = $('#textarea1').val();
input += '---' + text + '\n';
$('#textarea1').val(input);
}
-->
</script>
</html>
注:依赖jquery.js和json2.js。
运行效果:
---aa
---dd
---dddd
---undefined
---0,0,obj2.data[0].color
---{"chart":{"yAxisName":"ee"},"data":[{"label":0,"value":0,"color":"76A5DB"},{"label":2,"value":10,"color":"76A5DB"}]}