本帖最后由 黑黑黑黑黑黑 于 2017-12-21 15:51 编辑
前言无论是前端解析后端的数据还是做全栈的技术需要，你都可能多少需要知道些json的技术点，从json的标准格式到json的格式转换与传输，再到中转的处理。本文小编与你一起回顾json的最强知识点攻略。 概念javascript的对象表示法（javascript object notation）.json是用于存储和交换文本信息的语法，类似于xml，但是比xml更小、更快、更易解析。 语法json语法是js对象表示法的子集。 - 数据在名称、值对中
- 数据由逗号分隔
- 花括号保存对象
- 方括号保存数组
json的数值包括的值类型数字（整数或者浮点数）,字符串（双引号中）,逻辑值,数组,对象,null
var json={"name":"dcd";'obj':{...};"arr":[];......} json对象用一对�花括号表示对象，
{ "name":"runoob", "alexa":10000, "site":null } 你可以使用点号（.）来访问对象的值或者[] ,这点与js对象相同。毕竟是js对象表示法的子集。 for in遍历属性的时候只可以用【】的方式 [JavaScript] 纯文本查看 复制代码 var myObj = { "name":"runoob", "alexa":10000, "site":null };
for (x in myObj) {
console.log(myObj[x])
}
[backcolor=rgb(255, 255, 255)][font=-apple-system, "][JavaScript] 纯文本查看 复制代码 let myObj = {
"name":"runoob",
"alexa":10000,
"sites": {
"site1":"www.runoob.com",
"site2":"m.runoob.com",
"site3":"c.runoob.com"
}
}
let x = myObj.sites.site1;
// 或者
x = myObj.sites["site1"];json 对象和 json 字符串的区别 [JavaScript] 纯文本查看 复制代码 json 对象
var str2 = { "name": "asan", "sex": "man" };
json字符串
var str1 = '{ "name": "deyuyi", "sex": "man" }';
json对象中的数组- 遍历数组中的值
[JavaScript] 纯文本查看 复制代码 let myObj = {
"name": "网站",
"num": 3,
"sites": [
{ "name": "Google", "info": ["Android", "Google 搜索", "Google 翻译"] },
{ "name": "Runoob", "info": ["菜鸟教程", "菜鸟工具", "菜鸟微信"] },
{ "name": "Taobao", "info": ["淘宝", "网购"] }
]
}
for (let p in myObj.sites) {
console.log(myObj.sites[p])
} - 修改数组的值，你可以使用索引值来修改数组值
myObj.sites[1] = "Github"; - 删除，我们可以使用 delete 关键字来删除数组元素，和删除对象属性是一样的
delete myObj.sites[1];
json对象转换方法（字符串转对象）JSON.parse(text[, reviver])
我们可以使用 JSON.parse() 方法将数据转换为 JavaScript 对象。
text:必需， 一个有效的 JSON 字符串。
reviver: 可选，一个转换结果的函数， 将为对象的每个成员调用此函数。 let str={ "name":"runoob", "alexa":10000, "site":"www.runoob.com" }var obj = JSON.parse(str)json不能存储对象，如果需求需要那么要把对象转为字符串，然后再转换为正常的对象（reviver方法针对特殊的键进行处理 然后返回），比如时间,其中键名要加引号。 [JavaScript] 纯文本查看 复制代码 let datestr='{ "name":"Runoob", "initDate":"2013-12-14", "site":"www.runoob.com"}';
var obj = JSON.parse(datestr,function(key,value){
if(key=='initDate'){
return new Date(value);
}else{
return value
}
})
console.log(obj)浏览器支持：主流浏览器都支持 JSON.parse() 函数：
Firefox 3.5
Internet Explorer 8
Chrome
Opera 10
Safari 4 eval可以将js函数段执行也可以转换为对应的对象类型
[JavaScript] 纯文本查看 复制代码 var obj = eval ("(" + txt + ")");
对象转字符串~JSON.stringify()JSON.stringify(value[, replacer[, space]]) 参数说明：
value:
必需， 一个有效的 JSON 字符串。
replacer:
可选。用于转换结果的函数或数组。
如果 replacer 为函数，则 JSON.stringify 将调用该函数，并传入每个成员的键和值。使用返回值而不是原始值。如果此函数返回 undefined，则排除成员。根对象的键是一个空字符串：""。
如果 replacer 是一个数组，则仅转换该数组中具有键值的成员。成员的转换顺序与键在数组中的顺序一样。当 value 参数也为数组时，将忽略 replacer 数组。
space:
可选，文本添加缩进、空格和换行符，如果 space 是一个数字，则返回值文本在每个级别缩进指定数目的空格，如果 space 大于 10，则文本缩进 10 个空格。space 有可以使用非数字，如：\t。 使用：转换的时候会把日期类型转换为字符串；转换的时候不支持函数，对于函数需要提前转换为字符串，使用函数对象自带的toString() 方法.不建议json中存储函数。可以用发布模块的方式使用工具函数。 [JavaScript] 纯文本查看 复制代码 var obj = { "name":"runoob", "alexa":10000, "site":"www.runoob.com"};
var myJSON = JSON.stringify(obj);
//对象中包含函数的时候
var obj = { "name":"Runoob", "alexa":function () {return 10000;}, "site":"www.runoob.com"};
obj.alexa = obj.alexa.toString();
var myJSON = JSON.stringify(obj);浏览器支持：主流浏览器都支持 JSON.stringify() 函数
Firefox 3.5
Internet Explorer 8
Chrome
Opera 10
Safari 4
json的使用- 文本转换为json对象 eval()
var obj = eval ("(" + txt + ")"); - json解析器
json可以解释运行任何的js代码，这潜藏着一个安全问题，建议使用json自己的转换方法去执行。
jsonp的使用jsonp(JSON with Padding) 是 json 的一种"使用模式"，可以让网页从别的域名（网站）那获取资料，即跨域读取数据。这种作为跨域常用方案非常常见。 [JavaScript] 纯文本查看 复制代码 $.getJSON("http://www.runoob.com/try/ajax/jsonp.php?jsoncallback=?", function(data) {
var html = '<ul>';
for(var i = 0; i < data.length; i++)
{
html += '<li>' + data[i] + '</li>';
}
html += '</ul>';
$('#divCustomers').html(html);
});
|
收藏
淘帖
踩
