JSON简介以及用法汇总
JSON（JavaScript Object Notation）即JavaScript对象表示法，是一种轻量级的数据交换格式。它非常便于编程人员对数据的处理，也便于机器对数据的解析和生成，应用非常广泛。
JSON是一种轻量级的数据交换格式，某个JSON格式的文件内部譬如可以长成这样：
{
"name": "hanzichi",
"sex": "male"
}
看起来都是key-value的键值对，很像js的对象吧？没错，但同时JSON表示不服，我不能跟js的对象长成一样啊，我得有我自己的个性，于是规定键-值对中的键 必须用双引号 ！同时规定键-值对中的值的取值有一定要求：
JSON 值可以是：
数字（整数或浮点数）
字符串（ 在双引号中 ）
逻辑值（true 或 false）
数组（在方括号中）
对象（在花括号中）
null
除以上6种外，再无其他，没有像js一样的undefined、NAN，JSON拒绝使用。
如何使用JSON？
JSON一般以字符串的形式在数据交互过程中游走，so对于js而言，如何将json字符串和js对象之间进行相互转换显得尤为重要。
eval大法（json字符串 -> js对象）
var jsonStr = '{"name": "hanzichi", "sex": "male"}';
var ans = eval('(' + jsonStr + ')');
console.log(ans.name, ans.sex); // hanzichi male
eval 函数非常快，但是它可以编译任何 javascirpt 代码，这样的话就可能产生安全的问题。eval 的使用是基于传入的代码参数是可靠的假设下，有一些情况下，可能客户端是不可信任的。如果基于安全的考虑的话，最好是使用一个JSON解析器，一个JSON 解析器将只接受JSON文本，所以是更安全的，如下。
JSON.parse（json字符串 -> js对象）
var jsonStr = '{"name": "hanzichi", "sex": "male"}';
var obj = JSON.parse(jsonStr);
console.log(typeof obj, obj); // object Object {name: "hanzichi", sex: "male"}
第二个参数可以是函数，可以对值进行删改：
var jsonStr = '{"name": "hanzichi", "sex": "male", "age": 10}';
var obj = JSON.parse(jsonStr, function(key, value) {
if(key === 'name') {
return 'my name is ' + value;
}
return value;
});
console.log(typeof obj, obj); // object Object {name: "my name is hanzichi", sex: "male", age: 10}
JSON.stringify（js对象 -> json字符串）
var obj = {name: 'hanzichi', sex: 'male', age: '10'};
var jsonStr = JSON.stringify(obj);
console.log(jsonStr); // {"name":"hanzichi","sex":"male","age":"10"}
也可以加个参数，规定需要转化为json字符串的属性（数组形式，跟数组同名的js对象属性才会被转换）：
var obj = {name: 'hanzichi', sex: 'male', age: '10'};
var jsonStr = JSON.stringify(obj, ['name']);
console.log(jsonStr); // {"name":"hanzichi"}
第二个参数也可以是个函数，可以删选符合条件的属性（或者改变属性值，没有return表示放弃该属性，return的值表示该key在json字符串中的值）
var obj = {name: 'hanzichi', sex: 'male', age: '10'};
var jsonStr = JSON.stringify(obj, function(key, value) {
if(key === 'name') {
return 'my name is ' + value;
}
return value;
});
console.log(jsonStr); // {"name":"my name is hanzichi","sex":"male","age":"10"}
还可以有第三个参数，可以是数字或者字符串。
如果是数字的话，表示缩进，数字大小超过10了按10处理。
var obj = {name: 'hanzichi', sex: 'male', age: '10'};
var jsonStr = JSON.stringify(obj, null, 4);
console.log(jsonStr);
// {
// "name": "hanzichi",
// "sex": "male",
// "age": "10"
// }
也可以是字符串，会在属性前加上这些字符串充当前缀，同样字符串长度超过10只截取10：
var obj = {name: 'hanzichi', sex: 'male', age: '10'};
var jsonStr = JSON.stringify(obj, null, 'pre');
console.log(jsonStr);
// {
// pre"name": "hanzichi",
// pre"sex": "male",
// pre"age": "10"
// }
这里我有个疑问，我觉得输出应该是如下形式才对啊...
{
"prename": "hanzichi",
"presex": "male",
"preage": "10"
}
麻烦有知道的大大能倾情告诉我...
总结
当然传说中的ie8（及以下）因为某种缺陷不能使用JSON.parse()以及JSON.stringify()方法，而eval()又显得不安全，如果要兼容它们的话可以引用 json2.js 。
以上内容给大家介绍了JSON简介以及用法汇总，希望对大家有所帮助！
相关文章
js的event详解。...2006-09-09
有关script注入想必大家也有所了解，在本文将为大家介绍下如何屏蔽script注入，下面有个不错的示例大家可以感受下2013-11-11
reduce()方法接收一个函数做为累加器,数组中的每一个值(从左到右)开始缩减,最终计算为一个值,下面这篇文章主要给大家介绍了关于JavaScript中reduce()详解及使用方法的相关资料,需要的朋友可以参考下2023-04-04
这篇文章主要介绍了JS 学习总结之正则表达式的懒惰性和贪婪性的相关资料,需要的朋友可以参考下2017-07-07
iScroll 4 这个版本完全重写了iScroll这个框架的原始代码。这个项目的产生完全是因为移动版webkit浏览器（诸如iPhone，iPad，Android 这些系统上广泛使用）。下面这篇文章主要介绍了利用iscroll4实现轮播图效果的方法教程,需要的朋友可以参考下。2017-01-01
在JavaScript中,call、apply、bind、new是Function对象自带的三个方法,也是面试时常考的知识点，所以本文就来和大家讲讲如何手写实现这四个方法吧2023-05-05
这篇文章主要为大家详细介绍了微信小程序自定义对话框弹出和隐藏动画，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2018-07-07
这篇文章主要介绍了JS操作input标签属性checkbox全选的代码，非常不错，具有参考借鉴价值，需要的朋友可以参考下2017-03-03
通过使用CDN、压缩、异步加载、尽可能的减少JavaScript文件大小、利用缓存机制、使用Vanilla JS、使用ES6特性、将JavaScript文件放到底部、减少对DOM的访问以及避免重复代码等方法,可以优化JavaScript文件的加载和执行速度,提供更好的用户体验和更高的性能2023-08-08
这篇文章主要介绍了使用webpack搭建pixi.js开发环境，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2020-02-02
最新评论