JSON
JSON实际上是JavaScript的一个子集。在JSON中,一共就这么几种数据类型:
- number:和JavaScript的number完全一致;
- boolean:就是JavaScript的true或false;
- string:就是JavaScript的string;
- null:就是JavaScript的null;
- array:就是JavaScript的Array表示方式——[];
- object:就是JavaScript的{ … }表示方式。
JSON还定死了字符集必须是UTF-8。为了统一解析,JSON的字符串规定必须用双引号""
,Object的键也必须用双引号""
。
JavaScript内置了JSON的解析。
JS处理JSON
前提代码
var txt = '[ {"fistName" : "Bill", "lastName" : "Gates" },{ "fistName" : "Steve", "lastName" : "Jobs" },{ "fistName" : "Mark", "lastName" : "Zuckerberg" }]';
反序列化
eval
用法
eval(“(“+JsonStr+”)”)可以将JsonStr字符串转为Js中的json对象。
缺点
不安全,eval() 函数可编译并执行任何 JavaScript 代码。
案例
代码:
var arrayJsonObject =eval("("+txt+")");
console.log(arrayJsonObject );
JSON.parse()
用法
JSON 解析器将 JSON 转换为 JavaScript 对象,即JSON.parse(jsonstr);
。JSON 解析器只能识别 JSON 文本,而不会编译脚本。( 解析器的速度更快,推荐)
案例
1:代码:
var arrayJsonObject = JSON.parse(txt);
console.log(arrayJsonObject);
运行结果:
eval和JSON.parse()取得的结果一样,都是将字符串转为对象。
2:代码:
JSON.parse(string,function)转换string为对象时,还可以携带一个处理函数处理string。
JSON.parse('{"name":"小明","age":15}', function (key, value) {
if (key === 'name') {
return value + '同学';
}
return value;
});
运行结果:
Object {name: "小明同学", age: 14}
循环json对象
for (var i in arrayJsonObject) { //i不是key,是数组下标
console.log(i);
console.log("fistName:"+arrayJsonObject[i].fistName+"lastName:"+arrayJsonObject[i].lastName);
};
浏览器控制台打印结果:
0
fistName:Bill lastName:Gates
1
fistName:Steve lastName:Jobs
2
fistName:Mark lastName:Zuckerberg
序列化
JSON.stringify()
用法
JSON 解析器将 JSON对象( JavaScript 内置对象) 转换为JSON字符串,即JSON.stringify(jsonObject);
。
可以加上参数,按缩进输出,美化输出结果:JSON.stringify(jsonObject, null,' ');
案例
1:代码:
var arrayJsonObject = JSON.parse(txt);
console.log(arrayJsonObject);
var arrayJsonStr = JSON.stringify(arrayJsonObject , null,' ');
console.log(arrayJsonStr)
结果:
[Object, Object, Object]
0: Object
1: Object
2: Object
length: 3__proto__: Array[0]
[
{
"fistName": "Bill",
"lastName": "Gates"
},
{
"fistName": "Steve",
"lastName": "Jobs"
},
{
"fistName": "Mark",
"lastName": "Zuckerberg"
}
]
2:代码:
JSON.stringify(jsonObject, null,' ');
第二个参数可以为数组Array,用于控制如何筛选对象的键值,如果我们只想输出指定的属性,可以传入Array:
var txt = '[ {"fistName" : "Bill", "lastName" : "Gates" ,"completeName":"Bill Gates"},{ "fistName" : "Steve", "lastName" : "Jobs","completeName":"Steve Jobs" },{ "fistName" : "Mark", "lastName" : "Zuckerberg" ,"completeName":"Mark Zuckerberg"}]';
var arrayJsonObject = JSON.parse(txt);
var arrayJsonStr = JSON.stringify(arrayJsonObject, ['fistName','completeName'],' ');
console.log(arrayJsonStr)
结果:
[
{
"fistName": "Bill",
"completeName": "Bill Gates"
},
{
"fistName": "Steve",
"completeName": "Steve Jobs"
},
{
"fistName": "Mark",
"completeName": "Mark Zuckerberg"
}
]
3:代码:
JSON.stringify(jsonObject, null,' ');
第二个参数也可以为处理函数,这样对象的每个键值对都会被函数先处理:
var txt = '[ {"fistName" : "Bill", "lastName" : "Gates" ,"completeName":"比尔盖茨"},{ "fistName" : "Steve", "lastName" : "Jobs","completeName":"乔布斯" },{ "fistName" : "Mark", "lastName" : "Zuckerberg" ,"completeName":"Mark Zuckerberg"}]';
var arrayJsonObject = JSON.parse(txt);
function convert(key, value) {
if (typeof value === 'string') {
return value.toUpperCase();
}
return value;
}
var arrayJsonStr = JSON.stringify(arrayJsonObject, convert, ' ');
console.log(arrayJsonStr);
结果:
[
{
"fistName": "BILL",
"lastName": "GATES",
"completeName": "比尔盖茨"
},
{
"fistName": "STEVE",
"lastName": "JOBS",
"completeName": "乔布斯"
},
{
"fistName": "MARK",
"lastName": "ZUCKERBERG",
"completeName": "MARK ZUCKERBERG"
}
]
4:代码:
精准控制序列化
var xiaoming = {
name: '小明',
age: 14,
gender: true,
height: 1.65,
grade: null,
'middle-school': '\"W3C\" Middle School',
skills: ['JavaScript', 'Java', 'Python', 'Lisp'],
toJSON: function () {
return { // 只输出name和age,并且改变了key:
'Name': this.name,
'Age': this.age
};
}
};
console.log(JSON.stringify(xiaoming));
结果:
'{"Name":"小明","Age":14}'
JQ处理JSON
反序列化
将json字符串转换成json对象 $.parseJSON( jsonstr );
代码:
var txt = '[ {"fistName" : "Bill", "lastName" : "Gates" ,"completeName":"比尔盖茨"},{ "fistName" : "Steve", "lastName" : "Jobs","completeName":"乔布斯" },{ "fistName" : "Mark", "lastName" : "Zuckerberg" ,"completeName":"Mark Zuckerberg"}]';
var jsonObject = $.parseJSON(txt);
console.log(jsonObject);
结果:
[Object, Object, Object]
序列化
需要自己扩展,jQuery.stringifyJSON(obj)方法不存在。
处理
JQ异步ajax获取直接将type设为json,也可用$.getJSON()直接获取JSON对象
案例:
$.getJSON(“http://ip:prot/json”,{param:”value”},function(data){
$.each(data,function(index,content){ content.key; content.value; })
})
JSON官方处理
http://www.json.org/提供了一个json.js,这样ie8(兼容模式),ie7和ie6就可以支持JSON对象以及其stringify()和parse()方法。
可以在https://github.com/douglascrockford/JSON-js上获取到这个js,一般现在用json2.js。