本文实例讲述了JavaScript常见JSON操作。分享给大家供大家参考,具体如下:
1、JSON
JSON,JavaScript Object Notation)(JavaScript对象表示法) ,是存储和交换文本信息的语法,是基于JavaScript的一个子集。数据格式简单,易于读写,占用带宽小,类似 XML,但JSON 比 XML更小、更快,更易解析。
JSON不支持变量、函数、对象实例,只是一种数据的格式。数据在键值对中,数据由逗号分隔。
2、JSON数据类型
(1)简单数据类型:字符串、数值、布尔值,null(不支持JavaScript的 undefined)。
(2)对象:无序的键值对。
(3)数组:有序的值列表。
3、JSON对象与JavaScript对象的不同
(1)属性必须用双引号(最好不要用单引号,可能会出问题)。
(2)末尾无分号。
(3)不支持变量。
4、JSON数组与JavaScript数组的不同
(1)末尾无分号。
(2)不支持变量。
5、序列化
(1)JSON.stringify()方法
把JavaScript对象(JSON对象)序列化为JSON字符串的方法。默认情况下,输出的JSON字符串不包含任何空格字符或缩进,同时会忽略JavScript对象的函数和原型对象。
接收3个参数:过滤器、可选的过滤器(可以是函数,也可以是数组)、可选的字符串缩进数。
rush:js;">
var person = {
name: "Alice",age: 23,adult: true,friends: ["Bruce","Cindy"]
};
var jsonText1 = JSON.stringify(person);//Date对象在序列化后变成了JSON字符串
var jsonText2 = JSON.stringify(person,["name","friends"]);//Date对象在序列化后变成了JSON字符串
var jsonText3 = JSON.stringify(person,function(key,value) {
switch(key){
case "friends":
return value.join("|");//按指定分隔符将数组连接成
一个字符串
case "age":
return value + 1;
case "adult":
return undefined;//返回undefined则
删除此
属性
default:
return value;//其他值正常
显示
}
});
var jsonText4 = JSON.stringify(person,null,4);
alert(jsonText1);//{"name":"Alice","age":23,"adult":true,"friends":["Bruce","Cindy"]}
alert(jsonText2);//{"name":"Alice","Cindy"]}
alert(jsonText3);//{"name":"Alice","age":24,"friends":["Bruce|Cindy"]}
alert(jsonText4);
/*
{
"name":"Alice","friends":[
"Bruce","Cindy"
]
}
*/
(2)toJSON()方法
作为stringify()
方法中第2个参数过滤器的补充。stringify()
有时不能满足某些对象进行自定义序列化的需求,则给对象定义toJSON
()方法。
序列化对象的顺序:
- 1)若存在
toJSON()
方法且能通过它取得有效的值,则调用这个方法。否则,返回对象本身。
- 2)如果提供了第2个参数,应用此函数过滤器,传入函数过滤器的值是第1步返回的值。
- 3)对第2步返回的每个值进行相应的序列化。
- 4)如果提供了第3个参数,执行相应的格式化。
rush:js;">
var person = {
name: "Alice","Cindy"],toJSON:function(){
return {"name":"Alice","id":23,"Cindy"]};
}
};
var jsonText1 = JSON.stringify(person);//Date对象在序列化后变成了JSON字符串
var jsonText2 = JSON.stringify(person,["adult","id",value) {
switch(key){
case "friends":
return value.join("|");//按指定分隔符将数组连接成
一个字符串
case "id":
return value - 1;
case "age":
return value + 1;//返回undefined则
删除此
属性
default:
return value;//其他值正常
显示
}
});
var jsonText4 = JSON.stringify(person,"Cindy"]};
alert(jsonText2);//{"id":23,"id":22,"Cindy"
]
}
*/
(3)eval()方法
把JSON字符串解析成JavaScript对象(JSON对象)的第一种方法。
rush:js;">
var JSText = eval('(' + '{"name":"Alice","Cindy"]}' + ')');
alert(JSText.friends);//Bruce,Cindy
注意:eval方法只能在非严格模式中进行使用,在use strict
中是不允许使用这个方法的。
(4)jQuery.parseJSON()方法
把JSON字符串解析成JavaScript对象(JSON对象)的第二种方法。
需要先引入jQuery的js文件。
rush:js;">
var JSText = jQuery.parseJSON('{"name":"Alice","Cindy"]}');
alert(JSText.friends);//Bruce,Cindy
注意:从jQuery 3.0开始,不推荐使用jQuery.parseJSON()
方法,要解析JSON字符串,请改用原生的JSON.parse()
方法。
(5)JSON.parse()方法
把JSON字符串解析成JavaScript对象(JSON对象)的第三种方法。
接收2个参数:JSON字符串和可选的函数(在每个键值对上调用)。
eg1:
rush:js;">
var JSText1 = JSON.parse('{"name":"Alice","Cindy"]}');
var JSText2 = JSON.parse('{"name":"Alice","Cindy"]}',value) {
if (key == "friends")
return value.join("&");
else
return value;
});
alert(JSText1.friends);//Bruce,Cindy
alert(JSText2.friends);//Bruce&Cindy
注意:第一个参数是JSON字符串,因此JSON对象需要用引号引住。
eg2:
rush:js;">
var person = {
name: "Alice",birthday: new Date(1993,12,6)//保存了
一个Date对象
};
var jsonText = JSON.stringify(person);//Date对象在序列化后变成了JSON字符串
alert(jsonText);//{"name":"Alice","birthday":"1994-01-05T16:00:00:000Z"}
var JSText = JSON.parse(jsonText,value) {//解析在JSText中还原了Date对象,则JSText.birthdat
属性中会保存
一个Date对象
if (key == "birthday")
return new Date(value);
else
return value;
});
alert(JSText.birthday.getFullYear());//1994,已是Date对象,可以
调用getFullYear()
PS:这里再为大家推荐几款相关的json在线工具供大家参考:
代码检验、检验、美化、格式化工具:
JSON
在线格式化工具:
在线XML/JSON互相转换工具:
json
代码在线格式化/美化/压缩/编辑/转换工具:
在线json压缩/转义工具:
更多关于JavaScript相关内容可查看本站专题:《》、《》、《》、《》、《》及《用法总结
》
希望本文所述对大家JavaScript程序设计有所帮助。
原文地址:https://www.jb51.cc/js/31147.html
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。