JSON: JavaScript Object Notation(JavaScript 工具表示法)
JSON 是存储和交流文本信息的语法。类似 XML。
JSON 比 XML 更小、更快，更易解析。
JSON 实例
{\"大众sites\"大众: [{\"大众name\"大众:\"大众h5稠浊开拓\"大众 , \"大众url\"大众:\"大众www.dongyibiancheng.com\公众}, {\"大众name\公众:\"大众google\"大众 , \"大众url\公众:\公众www.google.com\"大众}, {\"大众name\"大众:\"大众微博\公众 , \"大众url\"大众:\"大众www.weibo.com\"大众}]}
这个 sites 工具是包含 3 个站点记录（工具）的数组。
什么是 JSON ？
JSON 指的是 JavaScript 工具表示法（JavaScript Object Notation）
JSON 是轻量级的文本数据交流格式
JSON 独立于措辞：JSON 利用 Javascript语法来描述数据工具，但是 JSON 仍旧独立于措辞和平台。JSON 解析器和 JSON 库支持许多不同的编程措辞。 目前非常多的动态（PHP，JSP，.NET）编程措辞都支持JSON。
JSON 具有自我描述性，更易理解
JSON - 转换为 JavaScript 工具
JSON 文本格式在语法上与创建 JavaScript 工具的代码相同。
由于这种相似性，无需解析器，JavaScript 程序能够利用内建的 eval() 函数，用 JSON 数据来天生原生的 JavaScript 工具。
JSON 简介
JSON - 简介在线实例
通过我们的编辑器，您可以在线编辑 JavaScript 代码，然后通过点击一个按钮来查当作果：
JSON 实例
<!DOCTYPEhtml><html><head><metacharset=\"大众utf-8\"大众><title>h5稠浊开拓(www.xxxx.com)</title></head><body><h2>JavaScript 创建 JSON 工具</h2><p>网站名称: <spanid=\"大众jname\"大众></span><br/> 网站地址: <spanid=\"大众jurl\公众></span><br/> 网站 slogan: <spanid=\"大众jslogan\"大众></span><br/></p><script>
varJSONObject= {\"大众name\公众:\"大众h5稠浊开拓\"大众, \"大众url\"大众:\"大众www.xxx.com\"大众, \"大众slogan\"大众:\"大众学的不仅是技能，更是梦想！
\公众};document.getElementById(\公众jname\"大众).innerHTML=JSONObject.namedocument.getElementById(\"大众jurl\"大众).innerHTML=JSONObject.urldocument.getElementById(\公众jslogan\"大众).innerHTML=JSONObject.slogan
</script></body></html>
考试测验一下 »
点击 \"大众考试测验一下\"大众 按钮查看在线实例。
与 XML 相同之处
JSON 是纯文本
JSON 具有\"大众自我描述性\"大众（人类可读）
JSON 具有层级构造（值中存在值）
JSON 可通过 JavaScript 进行解析
JSON 数据可利用 AJAX 进行传输
与 XML 不同之处
没有结束标签
更短
读写的速率更快
能够利用内建的 JavaScript eval() 方法进行解析
利用数组
不该用保留字
为什么利用 JSON？
对付 AJAX 运用程序来说，JSON 比 XML 更快更易利用：
利用 XML
读取 XML 文档
利用 XML DOM 来循环遍历文档
读取值并存储在变量中
利用 JSON
读取 JSON 字符串
用 eval() 处理 JSON 字符串
JSON 语法JSON 语法是 JavaScript 语法的子集。
JSON 语法规则
JSON 语法是 JavaScript 工具表示法语法的子集。
数据在名称/值对中
数据由逗号分隔
大括号保存工具
中括号保存数组
JSON 名称/值对
JSON 数据的书写格式是：名称/值对。
名称/值对包括字段名称（在双引号中），后面写一个冒号，然后是值：
\"大众name\"大众 : \"大众h5稠浊开拓\公众
这很随意马虎理解，等价于这条 JavaScript 语句：
name = \"大众h5稠浊开拓\公众
JSON 值
JSON 值可以是：
数字（整数或浮点数）
字符串（在双引号中）
逻辑值（true 或 false）
数组（在中括号中）
工具（在大括号中）
null
JSON 数字
JSON 数字可以是整型或者浮点型：
{\"大众age\"大众:30}
JSON 工具
JSON 工具在大括号（{}）中书写：
工具可以包含多个名称/值对：
{\"大众name\"大众:\公众h5稠浊开拓\公众 , \公众url\"大众:\"大众www.xxxx.com\"大众}
这一点也随意马虎理解，与这条 JavaScript 语句等价：
name = \公众h5稠浊开拓\"大众url = \公众www.xxxx.com\"大众
JSON 数组
JSON 数组在中括号中书写：
数组可包含多个工具：
{\"大众sites\公众: [{\"大众name\公众:\"大众h5稠浊开拓\公众 , \公众url\"大众:\"大众www.xxx.com\"大众}, {\"大众name\公众:\公众google\"大众 , \公众url\"大众:\公众www.google.com\"大众}, {\公众name\"大众:\公众微博\"大众 , \"大众url\公众:\"大众www.weibo.com\"大众}]}
在上面的例子中，工具 \"大众sites\"大众 是包含三个工具的数组。每个工具代表一条关于某个网站（name、url）的记录。
JSON 布尔值
JSON 布尔值可以是 true 或者 false：
{\"大众flag\"大众:true}
JSON null
JSON 可以设置 null 值：
{\公众runoob\"大众:null}
JSON 利用 JavaScript 语法
由于 JSON 利用 JavaScript 语法，以是无需额外的软件就能处理 JavaScript 中的 JSON。
通过 JavaScript，您可以创建一个工具数组，并像这样进行赋值：
实例
varsites = [{\"大众name\"大众:\公众runoob\"大众 , \"大众url\"大众:\"大众www.xxxx.com\"大众}, {\"大众name\公众:\公众google\公众 , \公众url\公众:\"大众www.google.com\"大众}, {\"大众name\"大众:\"大众微博\公众 , \"大众url\公众:\公众www.weibo.com\公众}];
可以像这样访问 JavaScript 工具数组中的第一项（索引从 0 开始）：
sites[0].name;
返回的内容是：
runoob
可以像这样修正数据：
sites[0].name=\公众h5稠浊开拓\"大众;
考试测验一下 »
不才面的章节，您将学到如何把 JSON 文本转换为 JavaScript 工具。
JSON 文件
JSON 文件的文件类型是 \公众.json\"大众
JSON 文本的 MIME 类型是 \公众application/json\"大众
JSON 工具工具语法
实例
{\"大众name\"大众:\"大众runoob\公众, \公众alexa\"大众:10000, \"大众site\"大众:null}
JSON 工具利用在大括号({})中书写。
工具可以包含多个 key/value（键/值）对。
key 必须是字符串，value 可以是合法的 JSON 数据类型（字符串, 数字, 工具, 数组, 布尔值或 null）。
key 和 value 中利用冒号(:)分割。
每个 key/value 对利用逗号(,)分割。
访问工具值
你可以利用点号（.）来访问工具的值：
实例
varmyObj, x;myObj = {\公众name\"大众:\公众runoob\公众, \公众alexa\公众:10000, \"大众site\公众:null};x = myObj.name;
考试测验一下 »
你也可以利用中括号（[]）来访问工具的值：
实例
varmyObj, x;myObj = {\"大众name\"大众:\"大众runoob\公众, \"大众alexa\"大众:10000, \"大众site\"大众:null};x = myObj[\"大众name\"大众];
考试测验一下 »
循环工具
你可以利用 for-in 来循环工具的属性：
实例
varmyObj = {\"大众name\"大众:\"大众runoob\"大众, \"大众alexa\"大众:10000, \"大众site\公众:null};for(xinmyObj){document.getElementById(\公众demo\公众).innerHTML += x + \"大众<br>\"大众;}
考试测验一下 »
在 for-in 循环工具的属性时，利用中括号（[]）来访问属性的值：
实例
varmyObj = {\"大众name\公众:\"大众runoob\"大众, \"大众alexa\"大众:10000, \"大众site\"大众:null};for(xinmyObj){document.getElementById(\"大众demo\"大众).innerHTML += myObj[x] + \公众<br>\公众;}
考试测验一下 »
嵌套 JSON 工具
JSON 工具中可以包含其余一个 JSON 工具：
实例
myObj = {\"大众name\"大众:\"大众runoob\"大众, \公众alexa\"大众:10000, \公众sites\"大众: {\"大众site1\"大众:\公众www.xxxx.com\"大众, \"大众site2\"大众:\"大众m.runoob.com\公众, \公众site3\"大众:\"大众c.runoob.com\"大众}}
你可以利用点号(.)或者中括号([])来访问嵌套的 JSON 工具。
实例
x = myObj.sites.site1;// 或者x = myObj.sites[\"大众site1\"大众];
考试测验一下 »
修正值
你可以利用点号(.)来修正 JSON 工具的值：
实例
myObj.sites.site1 = \"大众www.google.com\"大众;
考试测验一下 »
你可以利用中括号([])来修正 JSON 工具的值：
实例
myObj.sites[\公众site1\公众] = \"大众www.google.com\"大众;
考试测验一下 »
删除工具属性
我们可以利用 delete 关键字来删除 JSON 工具的属性：
实例
deletemyObj.sites.site1;
考试测验一下 »
你可以利用中括号([])来删除 JSON 工具的属性：
实例
deletemyObj.sites[\"大众site1\公众]
考试测验一下 »
JSON 数组数组作为 JSON 工具
实例
[\"大众Google\"大众, \公众Runoob\"大众, \"大众Taobao\"大众]
JSON 数组在中括号中书写。
JSON 中数组值必须是合法的 JSON 数据类型（字符串, 数字, 工具, 数组, 布尔值或 null）。
JavaScript 中，数组值可以是以上的 JSON 数据类型，也可以是 JavaScript 的表达式，包括函数，日期，及 undefined。
JSON 工具中的数组
工具属性的值可以是一个数组：
实例
{\"大众name\公众:\"大众网站\公众,\"大众num\"大众:3,\"大众sites\公众:[\公众Google\"大众, \"大众Runoob\"大众, \公众Taobao\"大众]}
我们可以利用索引值来访问数组：
实例
x = myObj.sites[0];
考试测验一下 »
循环数组
你可以利用 for-in 来访问数组：
实例
for(iinmyObj.sites){x += myObj.sites[i] + \"大众<br>\"大众;}
考试测验一下 »
你也可以利用 for 循环：
实例
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\"大众:[\"大众h5稠浊开拓\"大众, \"大众h5稠浊开拓工具\"大众, \"大众h5稠浊开拓微信\"大众]}, {\"大众name\"大众:\"大众Taobao\"大众, \"大众info\"大众:[\"大众淘宝\"大众, \"大众网购\"大众]}]}
我们可以利用 for-in 来循环访问每个数组：
实例
for(iinmyObj.sites){x += \"大众<h1>\"大众 + myObj.sites[i].name + \公众</h1>\"大众; for(jinmyObj.sites[i].info){x += myObj.sites[i].info[j] + \"大众<br>\"大众; }}
考试测验一下 »
修正数组值
你可以利用索引值来修正数组值：
实例
myObj.sites[1] = \公众Github\公众;
考试测验一下 »
删除数组元素
我们可以利用 delete 关键字来删除数组元素：
实例
deletemyObj.sites[1];
考试测验一下 »
JSON.parse()JSON 常日用于与做事端交流数据。
在吸收做事器数据时一样平常是字符串。
我们可以利用 JSON.parse() 方法将数据转换为 JavaScript 工具。
语法
JSON.parse(text[, reviver])
参数解释：
text:必需， 一个有效的 JSON 字符串。
reviver: 可选，一个转换结果的函数， 将为工具的每个成员调用此函数。
JSON 解析实例
例如我们从做事器吸收了以下数据：
{\"大众name\"大众:\"大众runoob\"大众, \公众alexa\"大众:10000, \"大众site\"大众:\"大众www.xxx.com\"大众}
我们利用 JSON.parse() 方法处理以上数据，将其转换为 JavaScript 工具：
varobj = JSON.parse('{ \公众name\"大众:\公众runoob\"大众, \公众alexa\公众:10000, \"大众site\公众:\"大众www.xxx.com\"大众 }');
解析前要确保你的数据是标准的 JSON 格式，否则会解析出错。
你可以利用我们的在线工具检测：https://c.runoob.com/front-end/53。
解析完成后，我们就可以在网页上利用 JSON 数据了：
实例
<pid=\公众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 数据
我们可以利用 AJAX 从做事器要求 JSON 数据，并解析为 JavaScript 工具。
实例
varxmlhttp = newXMLHttpRequest();xmlhttp.onreadystatechange = function(){if(this.readyState == 4 && this.status == 200){myObj = JSON.parse(this.responseText); document.getElementById(\"大众demo\"大众).innerHTML = myObj.name; }};xmlhttp.open(\"大众GET\公众, \"大众/try/ajax/json_demo.txt\公众, true);xmlhttp.send();
考试测验一下 »
查看做事端数据： json_demo.txt
从做事端吸收数组的 JSON 数据
如果从做事端吸收的是数组的 JSON 数据，则 JSON.parse 会将其转换为 JavaScript 数组：
实例
varxmlhttp = newXMLHttpRequest();xmlhttp.onreadystatechange = function(){if(this.readyState == 4 && this.status == 200){myArr = JSON.parse(this.responseText); document.getElementById(\"大众demo\"大众).innerHTML = myArr[1]; }};xmlhttp.open(\"大众GET\"大众, \"大众/try/ajax/json_demo_array.txt\"大众, true);xmlhttp.send();
考试测验一下 »
查看做事端数据： json_demo_array.txt
非常
解析数据
JSON 不能存储 Date 工具。
如果你须要存储 Date 工具，须要将其转换为字符串。
之后再将字符串转换为 Date 工具。
实例
vartext = '{ \"大众name\"大众:\公众Runoob\"大众, \"大众initDate\"大众:\"大众2013-12-14\"大众, \"大众site\"大众:\"大众www.runoob.com\"大众}';varobj = JSON.parse(text);obj.initDate = newDate(obj.initDate); document.getElementById(\"大众demo\"大众).innerHTML = obj.name + \"大众创建日期: \"大众 + obj.initDate;
考试测验一下 »
我们可以启用 JSON.parse 的第二个参数 reviver，一个转换结果的函数，工具的每个成员调用此函数。
实例
vartext = '{ \"大众name\"大众:\公众Runoob\"大众, \"大众initDate\"大众:\"大众2013-12-14\"大众, \"大众site\"大众:\"大众www.runoob.com\公众}';varobj = JSON.parse(text, function(key, value){if(key == \"大众initDate\公众){returnnewDate(value); }else{returnvalue;}}); document.getElementById(\"大众demo\"大众).innerHTML = obj.name + \"大众创建日期：\"大众 + obj.initDate;
考试测验一下 »
解析函数
JSON 不许可包含函数，但你可以将函数作为字符串存储，之后再将字符串转换为函数。
实例
vartext = '{ \"大众name\"大众:\公众Runoob\公众, \"大众alexa\公众:\"大众function () {return 10000;}\公众, \"大众site\"大众:\"大众www.runoob.com\"大众}';varobj = 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
