本文最后更新于：2021年7月23日晚上

JSON

JSON介绍

一、什么是JSON？

JSON (JavaScript Object Notation：JavaScript 对象表示法)是一种轻量级的数据交换格式。JSON是储存和交换文本信息的语法，类似XML。但是更小、更快、更灵活。JSON独立于语言，虽然JSON使用JavaScript语法描述数据对象，但是JSON仍然独立于语言和平台。JSON解析器和JSON库支持许多不同的编程语言（如PHP, JSP, .NET)。

JSON于XML的异同

相同：

JSON 是纯文本
JSON 具有”自我描述性”（人类可读）
JSON 具有层级结构（值中存在值）
JSON 可通过 JavaScript 进行解析
JSON 数据可使用 AJAX 进行传输

不同：

没有结束标签
更短
读写的速度更快
能够使用内建的 JavaScript eval() 方法进行解析
使用数组
不使用保留字

我们生而为人却不知为何来到这个世界，生命好就好在本没有意义，我们可以赋予它任何意义。

对AJAX应用程序来说，JSON比XML更快更易使用

使用XML：

读取XML文档
使用XML DOM来循环遍历文档
读取值并储存在变量中

使用JSON：

读取JSON字符串
用eval()处理JSON字符串

JSON学习

一、JSON语法

1.语法规则：

数据在名称/值（”name”:”value”）对，等价于name = ‘value’，例如
1
2
"age" = 30 //数字类型 "name" = "Quosimodo" //字符类型
数据由逗号分隔
大括号（{}）保存对象
中括号（[]）保存数组

2.JSON值

数字（整数或浮点数）
字符串（“要在双引号中”）
逻辑值（true或false）
数组（在中括号中）
对象（在大括号中）
null

3.JSON数组

JSON 数组在中括号中书写，数组可包含多个对象，**数组的元素不能是键值/对**：

myObj = {
    "sites": [
        { "name":"卡西莫多的礼物" , "url":"www.quosimodo.com" }, 
        { "name":"google" , "url":"www.google.com" }, 
        { "name":"微博" , "url":"www.weibo.com" }
    ]
}

通过下标直接访问：

1 2	`x = myObj.sites[0]; myObj.sites[1] = "Github";`

使用 for-in 来访问数组：

1
2
3

for (i in myObj.sites) {
    x += myObj.sites[i] + "<br>";
}

使用 for 循环：

1
2
3

for (i = 0; i < myObj.sites.length; i++) {
    x += myObj.sites[i] + "<br>";
}

嵌套 JSON 对象中的数组 JSON 对象中数组可以包含另外一个数组，或者另外一个 JSON 对象：

myObj = {
    "name":"网站",
    "num":3,
    "sites": [
        { "name":"Google", "info":[ "Android", "Google 搜索", "Google 翻译" ] },
        { "name":"Runoob", "info":[ "菜鸟教程", "菜鸟工具", "菜鸟微信" ] },
        { "name":"Taobao", "info":[ "淘宝", "网购" ] }
    ]
}
//循环遍历
for (i in myObj.sites) {
    x += "<h1>" + myObj.sites[i].name + "</h1>";
    for (j in myObj.sites[i].info) {
        x += myObj.sites[i].info[j] + "<br>";
    }
}

delete关键字删除数组元素：

1	`delete myObj.sites[0];`

4.JSON对象

对象可以包含多个名称/值对：

{ "name":"Quosimodo", "url":"www.quosimodo.cn" }
//等价于
name = "Quosimodo"
url = "www.quosimodo.cn"

对象可以用（.)直接访问对象的值，或者用中括号（[]），或者循环调用：

var myObj, x;
myObj = { "name":"Quosimodo", "age":999, "site":null };
x = myObj.name;//1
x = myObj["name"];//2
for (x in myObj){//3
   document.getElementById("demo").innerHTML += x+"<br>";
   document.getElementById("demo").innerHTML += myObj[x] +"<br>";//循环中也可以用中括号访问
}

对象可以嵌套JSON对象，对象属性的值可以是一个数组：

myObj = {
    "name":"Quosimodo",
    "age":9999,
    "sites": {
        "site1":"www.quosimodo.com",
        "site2":"m.quosimodo.com",
        "site3":"c.quosimodo.com"
    }
    "we":["Quosimodo", "Piano", "Whitenight"]
}

访问方式和前面相同，只是多了几层调用：

x = myObj.sites.site1;
x = myObj.sites["site1"];
//可以通过这种方式直接修改
myObj.sites["site1"] = "www.baidu.com";

通过delete关键字删除对象属性：

1 2	`delete myObj.sites.site1; delete myObj.sites["site1"];`

5.JSON 数字

1	`{ "age": 99 }`

6.JSON 布尔类型

1	`{ "flag": true }`

7.JSON null

1	`{ "flag":null }`

8.JSON使用JavaScript语法

因为JSON使用JavaScript语法，所以无需额外的软件就能处理JavaScript中的JSON。通过JavaScript可以直接创建一个对象数组，并像这样赋值：

var sites = [
    { "name":"Quosimodo", "url":"www.quosimodo.cn" },
    { "name":"Google", "url":"www.google.com" },
    { "name":"Baidu", 'url':"www.baidu.com" }
];

因为创建的是数组对象，所以可以直接这样调用：

1	`sites[0].name;`

返回 “Quosimodo”。也可以通过这种方式直接修改数据:

1	`sites[0].name = "Yahoo";`

三、JSON的使用

1.JSON.parse()

JSON 通常用于与服务端交换数据。在接收服务器数据时一般是字符串。我们可以使用 JSON.parse() 方法将数据转换为 JavaScript 对象。

1	`JSON.parse(text[, reviver])`

参数说明：

**text:**必需，一个有效的 JSON 字符串。
reviver: 可选，一个转换结果的函数，将为对象的每个成员调用此函数。

JSON 解析实例

<p id="demo"></p>

<script>
var obj = JSON.parse('{ "name":"runoob", "alexa":10000, "site":"www.runoob.com" }');//解析后就能使用
document.getElementById("demo").innerHTML = obj.name + "：" + obj.site;
</script>

异常

解析数据

JSON 不能存储 Date 对象。如果你需要存储 Date 对象，需要将其转换为字符串。之后再将字符串转换为 Date 对象。

var text = '{ "name":"Runoob", "initDate":"2013-12-14","site":"www.runoob.com"}'; 
var obj = JSON.parse(text);
obj.initDate = new Date(obj.initDate);
document.getElementById("demo").innerHTML = obj.name + "创建日期: " + obj.initDate;

我们可以启用 JSON.parse 的第二个参数 reviver，一个转换结果的函数，对象的每个成员调用此函数。

var text = '{ "name":"Runoob", "initDate":"2013-12-14", "site":"www.runoob.com"}';
var obj = JSON.parse(text, function (key, value) {
    if (key == "initDate") {
        return new Date(value);
    } else {
        return value;
}});

document.getElementById("demo").innerHTML = obj.name + "创建日期：" + obj.initDate;

解析函数

JSON 不允许包含函数，但你可以将函数作为字符串存储，之后再将字符串转换为函数。

var text = '{ "name":"Runoob", "alexa":"function () {return 10000;}","site":"www.runoob.com"}';
var obj = JSON.parse(text);
obj.alexa = eval("(" + obj.alexa + ")");
document.getElementById("demo").innerHTML = obj.name + " Alexa 排名：" + obj.alexa();

不建议在 JSON 中使用函数。

浏览器支持

主流浏览器都支持 JSON.parse() 函数：

Firefox 3.5
Internet Explorer 8
Chrome
Opera 10
Safari 4

2.JSON.stringify()

JSON 通常用于与服务端交换数据。在向服务器发送数据时一般是字符串。我们可以使用 JSON.stringify() 方法将 JavaScript 对象转换为字符串。

1	`JSON.stringify(value[, replacer[, space]])`

参数说明：

value: 必需，要转换的 JavaScript 值（通常为对象或数组）。
replacer: 可选。用于转换结果的函数或数组。如果 replacer 为函数，则 JSON.stringify 将调用该函数，并传入每个成员的键和值。使用返回值而不是原始值。如果此函数返回 undefined，则排除成员。根对象的键是一个空字符串：””。如果 replacer 是一个数组，则仅转换该数组中具有键值的成员。成员的转换顺序与键在数组中的顺序一样。当 value 参数也为数组时，将忽略 replacer 数组。
space: 可选，文本添加缩进、空格和换行符，如果 space 是一个数字，则返回值文本在每个级别缩进指定数目的空格，如果 space 大于 10，则文本缩进 10 个空格。space 也可以使用非数字，如：\t。
实例

<p id="demo"></p>

//JavaScript 对象转换
var obj = { "name":"runoob", "alexa":10000, "site":"www.runoob.com"}; var myJSON = JSON.stringify(obj); document.getElementById("demo").innerHTML = myJSON;

//JavaScript 数组转换
var arr = [ "Google", "Runoob", "Taobao", "Facebook" ];
var myJSON = JSON.stringify(arr);
document.getElementById("demo").innerHTML = myJSON;

异常

解析数据

JSON 不能存储 Date 对象。 JSON.stringify() 会将所有日期转换为字符串。

1	`var obj = { "name":"Runoob", "initDate":new Date(), "site":"www.runoob.com"}; var myJSON = JSON.stringify(obj); document.getElementById("demo").innerHTML = myJSON;`

之后你可以再将字符串转换为 Date 对象。

解析函数

JSON 不允许包含函数，JSON.stringify() 会删除 JavaScript 对象的函数，包括 key 和 value。

1	`var obj = { "name":"Runoob", "alexa":function () {return 10000;}, "site":"www.runoob.com"}; var myJSON = JSON.stringify(obj); document.getElementById("demo").innerHTML = myJSON;`

我们可以在执行 JSON.stringify() 函数前将函数转换为字符串来避免以上问题的发生：

var obj = { "name":"Runoob", "alexa":function () {return 10000;}, "site":"www.runoob.com"}; obj.alexa = obj.alexa.toString(); var myJSON = JSON.stringify(obj);  document.getElementById("demo").innerHTML = myJSON;

不建议在 JSON 中使用函数。

浏览器支持

主流浏览器都支持 JSON.stringify() 函数：

Firefox 3.5
Internet Explorer 8
Chrome
Opera 10
Safari 4

Program Others

Json

本博客所有文章除特别声明外，均采用 CC BY-SA 4.0 协议，转载请注明出处！

Matlab笔记（二）上一篇

从前慢---木心下一篇

JSON

JSON

JSON介绍

一、什么是JSON？

JSON于XML的异同

相同：

不同：

使用XML：

使用JSON：

JSON学习

一、JSON语法

1.语法规则：

2.JSON值

3.JSON数组

4.JSON对象

对象可以包含多个 名称/值 对：

对象可以用（.)直接访问对象的值，或者用中括号（[]），或者循环调用：

对象可以嵌套JSON对象，对象属性的值可以是一个数组：

访问方式和前面相同，只是多了几层调用：

通过delete关键字删除对象属性：

5.JSON 数字

6.JSON 布尔类型

7.JSON null

8.JSON使用JavaScript语法

三、JSON的使用

1.JSON.parse()

JSON 解析实例

异常

解析数据

解析函数

浏览器支持

2.JSON.stringify()

实例

异常

解析数据

解析函数

浏览器支持

对象可以包含多个名称/值对：