JSON与JavaScript对象
JSON是一种表示结构化数据的存储格式，语法格式上与JavasScript对象有些类似。
TIPS: 与JavaScript对象的格式区别
- 不支持变量、函数或对象实例
- 字符串，属性名必须使用双引号
- 无需定义变量存储引用
// JSON对象
{
"name": "KenTsang",
"age": 27,
"job": "Developer"
}
// js对象(该对象将作在后续例子引用)
let person = {
name: 'KenTsang',
age: 27,
job: 'Developer'
}
ES5定义了一个全局对象JSON，IE8+以上支持，该对象提供来stringify和parse两个方法用于JSON数据解析和序列化。
stringify()
stringify用于把JavaScript对象序列化JSON字符串，
在序列化JavaScript对象时，所有函数及原型成员都会被有意忽略，不体现在结果中。此外，值为undefined的任何属性也都会被跳过。
JSON.stringify(
value: Object,
replace: Array | function(key,value) {},
space: number | string
)
该方法接受三个参数
- 参数：接收传入的js对象
- 参数：过滤器（数组/函数）
- 参数：字符串缩进（数值/字符串）
参数2 - 过滤器
TIPS1: 过滤器是一个数组时，序列化结果只包含数组中列出的属性
let result = JSON.stringify(person, ["name", "job"]);
// 输出结果
// {"name":"KenTsang","job":"Developer"}
TIPS2: 过滤器是一个函数时（替换函数）
var jsonStr = JSON.stringify(Person, function(key, value){
if (key == 'age') {
return 'secret';
} else {
return value;
}
})
// 输出结果
// {"name":"KenTsang","age":"secret","job":"Developer"}
如果替换函数返回的是undefined，则该属性不会被包含在序列化结果中。
参数3 - 字符串缩进
用于控制序列化结果中的缩进和空白符，输出序列结果带缩进格式，方便预览查看。实际应用开发不多。
- 为数值时，表示每个级别缩进的空格数（最大10）
- 为字符串时，则作为缩进字符（替换默认的空格，最大10个字符）
let result = JSON.stringify(person, null, '--');
// 输出结果
/*
{
--"name": "KenTsang",
--"age": 27,
--"job": "Developer"
}
*/
toJSON()方法
应对更复杂的一些需求，我们可以通过toJSON()对某些对象进行自定义序列化的需求。
let person = {
name: "KenTsang",
age: 27,
job: 'Developer',
toJSON: function() {
return {
"name": "KT",
"age": "2*",
"job": "DP"
}
}
};
let result = JSON.stringify(person);
// 输出结果
// {"name":"KT","age":"2*","job":"DP"}
TIPS: 序列化顺序
- 如果存着toJSON方法而且能通过它取得有效的值，则调用该方法。否则，返回对象本身。
- 如果提供了第二个参数，应用这个函数过滤器。传入函数过滤器的值是第(1)步的值。
- 对第(2)步返回的每个值进行相应的序列化。
- 如果提供了第三个参数，执行相应的格式化。
-- 摘自《JavaScript高级程序设计》--
parse()
parse用于把JSON字符串解析成JavaScript对象
JSON.parse(text: string, reviver: function(key, value) {})
该方法接受三个参数
- 参数：接收传入的json字符串
- 参数：还原函数
还原函数
- 返回undefined, 结果中删除相应的键
- 返回其它值，则将值插入到结果中
let Person = {
name: "KenTsang",
age: 27,
job: "Developer",
birth: new Date(1991, 3, 19)
};
var jsonStr = JSON.stringify(Person);
var jsObj = JSON.parse(jsonStr, function(key, value) {
if (key == 'birth') {
return new Date(value);
} else {
return value);
}
});
jsObj.birth.getFullYearh();
// 输出结果： 1991
例子中通过还原函数，重新实例一个Date对象，所以可以用到getFullYear()方法。
参考文档
作者：以乐之名
本文原创，有不当的地方欢迎指出。转载请指明出处。