<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>JSON.stringify(),
JSON.parse(),toJSON()方法使用</title>
</head>
<body>
<script>
/*
JSON.stringify(),将value(Object,Array,String,Number...)序列化为JSON字符串
JSON.parse(), 将JSON数据解析为js原生值
toJSON(),作为JSON.stringify中第二个参数(函数过滤器)补充
*/
// JSON.stringify()
/*@specify : serialization(序列化)
@method : JSON.stringify(value,filter,indent);
@return : JSON字符串
@param : value {type :String|Object|String|Number|Boolean|null} {explain :传入的类型可以是列出的這些}
@param : filter : {type : []|{}} {explain :过滤器可以是个数组,也可以是个函数}
@param : indent : {type : Number | 特殊符号} {explain :如果是数字则代表空白符的个数,最多10个;也可以直接传入缩进的符号}
*/
var gather = {
id : 1314,
name : 'pom',
infor : {
age : 20,
sex : 'man',
marry : false,
identity : 622421,
habit : ['篮球','台球','乒乓球','游戏',true]
},
family : ['妈妈','爸爸','弟弟'],
likeGames : ['PCgame','Netgame']
};
var jsonText = JSON.stringify(gather,null,4);
console.log(jsonText);
/*{
"id": 1314,
"name": "pom",
"infor": {
"age": 20,
"sex": "man",
"marry": false,
"identity": 622421,
"habit": [
"篮球",
"台球",
"乒乓球",
"游戏",
true
]
},
"family": [
"妈妈",
"爸爸",
"弟弟"
],
"likeGames": [
"PCgame",
"Netgame"
]
}*/
console.log(typeof(jsonText));//string
// 第二个参数是数组,只会序列化返回数组里列出的名称
var jsonText1 =JSON.stringify(gather,['id','family'],'=');
console.log(jsonText1);
/*{
="id": 1314,
="family": [
=="妈妈",
=="爸爸",
=="弟弟"
=]
}
*/
var jsonText2 = JSON.stringify(gather,function(key,val){
switch(key){
case 'id' :
return 'id is ' + val;
case 'family' :
return val.join('@');
case 'infor' :
//infor的val 还可以使用JSON.stringify()
//return JSON.stringify(val,["age","sex"]);
return Object.prototype.toString.call(val).slice(8, -1);//Object
// return Object.prototype.toString.call(val);//[object Object]
case 'likeGames' :
//通过返回undefined删除该属性
return undefined;
//一定要default,以便传入的其他值能正常的返回到序列化结果中。
default :
return val;
}
},'#');
console.log(jsonText2);
/*{
#"id": "id is 1314",
#"name": "pom",
#"infor": "Object",
#"family": "妈妈@爸爸@弟弟"
}*/
// toJSON()
/*@specify :JSON.stringify()不能满足对某些对象进行自定义序列化的需求,可以通过对象那个上调用toJSON()方法
@method : date.toJSON()
@return : 返回任何序列化的值。*/
// JSON.parse() ,eval_r() 也可以解析并返回js对象和数组等。但IE8以下浏览器会有安全隐患。
/*@specify : 将json字符串解析为原生的javascript值。
@method : JSON.parse(val,replacer)
@param : val{type : String} {explain : 需要解析的json字符串}
@param : replacer {type : function}
{explain :和JSON.stringify()第二个参数类似,接受2个参数,key,val,不过是用来还原json串的函数}*/
var products = {
name:'aa',
age:'23',
toJSON:function(){
return this.name;
}
}
var prostr = JSON.stringify(products);
console.log(prostr);//'aa'
//obj中的relaeseDate对象序列化之后成了有效的json串
var obj = {
title : '对象的标题',
type : 'primitive' ,
releaseDate : new Date(2012,03,1)
};
//转化为json串
var o = JSON.stringify(obj);
console.log(o);//{"title":"对象的标题","type":"primitive","releaseDate":"2012-03-31T16:00:00.000Z"}
//在parsedO中还原为一个Date对象(会基于相应的值创建一个新的Date对象,结果parsedO.releaseDate属性中保存了一个Date对象)
var parsedO = JSON.parse(o,function(k,v){
if(k == 'releaseDate'){
return new Date(v);
}else{
return v;
}
});
console.log(parsedO);
/*Object {title: "对象的标题", type: "primitive", releaseDate: Sun Apr 01 2012 00:00:00 GMT+0800 (中国标准时间)}*/
//可以调用getFullYear()
console.log(parsedO.releaseDate.getFullYear()); //2012
/*执行原理:
toJSON()作为JSON.stringify中第二个参数(函数过滤器)补充,理解内部顺序很重要。
假设把一个对象传入JSON.stringify() 序列化对象的顺序如下:
(1)如果存在toJSON()方法而且能通过它取得有效的值,则调用该方默认顺序执行序列化
(2)如果提供了第二个参数,应用这个函数过滤器,传入的函数过滤器)步返回的值。
(3)对第(2)步 返回的每个值进行相应的序列化。
(4)如果提供了第三个参数,执行相应的格式化操作。*/
</script>
</body>
</html>