我是灼灼，一只初学Java的大一金渐层。
向往余秀华和狄兰·托马斯的疯狂，时常沉溺于将情感以诗相寄；追逐过王尔德、王小波的文字，后陷于毛姆和斯蒂芬·金不可自拔；热爱文学的浪潮，白日梦到底却总在现实里清醒；艳羡平静又极度渴盼奔跑的力量。
欢迎与我交流鸭· QQ:1517526827；
个人博客：https://blog.csdn.net/weixin_52777510?spm=1001.2101.3001.5343

JSON 学习笔记

之前有在java中学习过JSON的使用！
内容来自菜鸟教程：JSON部分~

文章目录

JSON 学习笔记

JSON 实例

{
    
        
    "sites": [    
    {
    
     "name":"菜鸟教程" , "url":"www.runoob.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 实例（看起来和html很像）

扫描二维码关注公众号，回复： 12683819 查看本文章

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)</title>
</head>
<body>
<h2>JavaScript 创建 JSON 对象</h2>
<p>
网站名称: <span id="jname"></span><br /> 
网站地址: <span id="jurl"></span><br /> 
网站 slogan: <span id="jslogan"></span><br /> 
</p>
<script>
var JSONObject= {
     
     
    "name":"菜鸟教程",
    "url":"www.runoob.com", 
    "slogan":"学的不仅是技术，更是梦想！"
};
document.getElementById("jname").innerHTML=JSONObject.name 
document.getElementById("jurl").innerHTML=JSONObject.url 
document.getElementById("jslogan").innerHTML=JSONObject.slogan
</script>
 
</body>
</html>

菜鸟教程(runoob.com)

JavaScript 创建 JSON 对象

网站名称:
网站地址:
网站 slogan:

与 XML 相同之处

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

与 XML 不同之处

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

为什么使用 JSON？

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

使用 XML

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

使用 JSON

读取 JSON 字符串
用 eval() （js内建）处理 JSON 字符串
JSON.Parse 解析 JSON 字符串

JSON 语法

JSON 语法规则

JSON 语法是 JavaScript 对象表示语法的子集。

数据在名称/值对中
数据由逗号分隔
大括号 {} 保存对象
中括号 [] 保存数组，数组可以包含多个对象

它们喜欢用冒号，而不是=号

JSON 名称/值对

JSON 数据的书写格式是：

key : value

名称/值对——包括字段名称（在双引号中），后面写一个冒号，然后是值：

例如——“name” : “菜鸟教程”

等价于JavaScript 语句：

name = “菜鸟教程”

JSON 值

JSON 值可以是：

数字（整数或浮点数）
字符串（在双引号中""）
逻辑值（true 或 false）
数组（在中括号中[]）
对象（在大括号中{}）
null

JSON 数字

JSON 数字可以是整型或者浮点型：

{ “age”:30 }

JSON 对象

JSON 对象在大括号 {} 中书写：

{
    
    key1 : value1, key2 : value2, ... keyN : valueN }

对象可以包含多个名称/值对，用逗号分隔：

{ “name”:“菜鸟教程” , “url”:“www.runoob.com” }

与 JavaScript 语句等价：

name = “菜鸟教程” url = “www.runoob.com”

对象语法

实例：

{
    
     "name":"runoob", "alexa":10000, "site":null }

对象可以包含多个 **key/value（键/值）**对。
key 必须是字符串，value 可以是合法的 JSON 数据类型（字符串, 数字, 对象, 数组, 布尔值或 null）。
key 和 value 中使用冒号(:)分割。
每个 key/value 对使用逗号(,)分割。

访问对象值

可以使用点号（.）来访问对象的值：

var myObj, x; 
myObj = {
    
     "name":"runoob", "alexa":10000, "site":null }; 
x = myObj.name;//获取 myObj对象的name字段的值，这里的.不是子类的意思，只表示访问

也可以使用中括号（[]）来访问对象的值：

var myObj, x; 
myObj = {
    
     "name":"runoob", "alexa":10000, "site":null }; 
x = myObj["name"];//使用[]就要在key的两边加上""

循环对象

可以使用 for-in 来循环对象的属性：

var myObj = {
    
     "name":"runoob", "alexa":10000, "site":null }; 
for (x in myObj) {
    
    //for和in变成一个整体啦！
	document.getElementById("demo").innerHTML += x + "<br>"; // id为"demo"的内容到    .innerHTML 的内容,后者的内容是x加上换行
}

在 for-in 循环对象的属性时，使用中括号（[]）来访问属性的值：

var myObj = {
    
     "name":"runoob", "alexa":10000, "site":null }; 
for (x in myObj) {
    
        
    document.getElementById("demo").innerHTML += myObj[x] + "<br>"; //看不懂的时候注意观察两个代码的不同点，访问myObj对象的x这个key的值
}

嵌套 JSON 对象

JSON 对象中可以包含另外一个 JSON 对象：

myObj = {
    
        
    "name":"runoob",    
    "alexa":10000,    
    "sites": {
    
            
        "site1":"www.runoob.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对象并修改它的值！

可以使用**中括号([])**来修改 JSON 对象的值：

myObj.sites["site1"] = "www.google.com";

删除对象属性

可以使用 delete 关键字来删除 JSON 对象的属性：

delete myObj.sites.site1;

可以使用中括号([])来删除 JSON 对象的属性（又见到了中括号，复习一下，它可以访问对象的值，访问属性的值，访问嵌套的JSON对象，可以访问嵌套的json对象并修改它的值）：

delete myObj.sites["site1"]

JSON 数组

JSON 数组在中括号 [] 中书写：

数组可包含多个对象，多个对象之间用逗号分隔，栗子就像一开始的那个：

[
    {
    
     key1 : value1-1 , key2:value1-2 }, 
    {
    
     key1 : value2-1 , key2:value2-2 }, 
    {
    
     key1 : value3-1 , key2:value3-2 }, 
    ...
    {
    
     keyN : valueN-1 , keyN:valueN-2 }, 
]

每个对象代表一条记录。

数组作为 JSON 对象：

[ "Google", "Runoob", "Taobao" ]

JSON 中数组值必须是合法的 JSON 数据类型（字符串, 数字, 对象, 数组, 布尔值或 null）。

JavaScript 中，数组值可以是以上的 JSON 数据类型，也可以是 JavaScript 的表达式，包括函数，日期，及 undefined。

JSON 对象中的数组

对象属性的值可以是一个数组：

{
    
     "name":"网站", "num":3, "sites":[ "Google", "Runoob", "Taobao" ] }//单指sites的值

可以使用索引值来访问数组（索引从零开始）：

x = myObj.sites[0];

循环数组

可以使用 for-in 来访问数组（这种文件和html基本一致，js写在script标签内！）：

<p id="demo"></p>
var myObj, i, x = "";
myObj = {
    
    
	"name":"网站",
	"num":3,
	"sites":[ "Google", "Runoob", "Taobao" ]
};

for (i in myObj.sites) {
    
    
    x += myObj.sites[i] + "<br>";
}//这里是主体！

document.getElementById("demo").innerHTML = x;

也可以使用 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":[ "菜鸟教程", "菜鸟工具", "菜鸟微信" ] },        
    {
    
     "name":"Taobao", "info":[ "淘宝", "网购" ] }    
    ] 
}

可以使用 for-in 来循环访问每个数组：

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>";    //换行
	} 
}

document.getElementById("demo").innerHTML = x;

修改数组值

可以使用索引值来修改数组值：

myObj.sites[1] = "Github";//修改后再通过for-in循环查看是否修改

删除数组元素

可以使用 delete 关键字来删除数组元素：

delete myObj.sites[1];//删除后再通过for-in循环查看是否删除

JSON 布尔值

JSON 布尔值可以是 true 或者 false：

{ “flag”:true }

JSON null

JSON 可以设置 null 值：

{ “runoob”:null }

JSON 使用 JavaScript 语法

因为 JSON 使用 JavaScript 语法，所以无需额外的软件就能处理 JavaScript 中的 JSON。

通过 JavaScript，可以创建一个对象数组，并进行赋值：

var sites = [    
	{
    
     "name":"runoob" , "url":"www.runoob.com" },     
	{
    
     "name":"google" , "url":"www.google.com" },     
	{
    
     "name":"微博" , "url":"www.weibo.com" } 
];

可以访问 JavaScript 对象数组中的第一项（索引从 0 开始）：

sites[0].name;

返回的内容是：

runoob

可以修改数据：

sites[0].name=“菜鸟教程”;

JSON 文件

JSON 文件的文件类型是 .json
JSON 文本的 MIME 类型是 application/json

JSON vs XML

JSON 和 XML 都用于接收 web 服务端的数据。

JSON 和 XML在写法上有所不同：

JSON 实例

{
    
        
"sites": [    
	{
    
     "name":"菜鸟教程" , "url":"www.runoob.com" },     
	{
    
     "name":"google" , "url":"www.google.com" },     
	{
    
     "name":"微博" , "url":"www.weibo.com" }    
	] 
}

XML 实例

<sites>   
	<site>     
		<name>菜鸟教程</name> <url>www.runoob.com</url>   
	</site>   
	<site>     
		<name>google</name> <url>www.google.com</url>   
	</site>   
	<site>     
		<name>微博</name> <url>www.weibo.com</url>   
	</site> 
</sites>

JSON 与 XML 的相同之处：

JSON 和 XML 数据都是 “自我描述” ，都易于理解。
JSON 和 XML 数据都是有层次的结构
JSON 和 XML 数据可以被大多数编程语言使用

JSON 与 XML最大的不同是：XML 需要使用 XML 解析器来解析，JSON 可以使用标准的 JavaScript 函数来解析。

JSON.parse(): 将一个 JSON 字符串转换为 JavaScript 对象。

JSON.stringify(): 将 JavaScript 值转换为 JSON 字符串。

相关内容

JavaScript JSON: https://www.runoob.com/js/js-json.html
XML DOM 教程: https://www.runoob.com/dom/dom-tutorial.html

JSON.parse()

JSON 通常用于与服务端交换数据。

在接收服务器数据时一般是字符串。

可以使用 JSON.parse() 方法将数据转换为 JavaScript 对象。

JSON.parse()方法会检查需要转换的字符串是否符合json格式。

语法

JSON.parse(text[, reviver])

参数说明：

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

JSON 解析实例

例如从服务器接收了以下数据：

{
    
     "name":"runoob", "alexa":10000, "site":"www.runoob.com" }

使用 JSON.parse() 方法处理以上数据，将其转换为 JavaScript 对象：

var obj = JSON.parse('{ "name":"runoob", "alexa":10000, "site":"www.runoob.com" }');

解析前要确保数据是标准的 JSON 格式，否则会解析出错。

解析完成后就可以在网页上使用 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.parse()，以下二种方法也可以将json字符串转化为json 对象：

var str1 = '{ "name": "emm", "sex": "man" }';
console.log(eval("("+str1+")"));
console.log((new Function("","return "+str1))());

加上圆括号的目的是迫使eval函数在处理JavaScript代码的时候强制将括号内的表达式（expression）转化为对象，而不是作为语句（statement）来执行

console.log(eval("{}"));// return undefined
console.log(eval("({})"));// return object[Object]

从服务端接收 JSON 数据

可以使用 AJAX 从服务器请求 JSON 数据，并解析为 JavaScript 对象：

var xmlhttp = new XMLHttpRequest(); 
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();//null

xmlhttp_request.open(‘GET’, URL, true);
xmlhttp_request.send(null);
open()的第一个参数是HTTP请求方式—GET，POST或任何服务器所支持的调用的方式。按照HTTP规范，该参数要大写；否则，某些浏览器(如Firefox)可能无法处理请求。
第二个参数是请求页面的URL。
第三个参数设置请求是否为异步模式。如果是TRUE，JavaScript函数将继续执行，而不等待服务器响应。这就是"AJAX"中的"A"。

服务器的响应

需要告诉HTTP请求对象用哪一个JavaScript函数处理这个响应。可以将对象的onreadystatechange属性设置为要使用的JavaScript的函数名，如下所示：
xmlhttp_request.onreadystatechange =FunctionName;
FunctionName是用JavaScript创建的函数名，注意不要写成FunctionName()，也可以直接将JavaScript代码创建在onreadystatechange之后，例如：
xmlhttp_request.onreadystatechange = function(){
// JavaScript代码段
};
首先要检查请求的状态。只有当一个完整的服务器响应已经收到了，函数才可以处理该响应。XMLHttpRequest 提供了readyState属性来对服务器响应进行判断。

xmlhttp.readyState的值及解释：

0：请求未初始化（还没有调用 open()）。
1：请求已经建立，但是还没有发送（还没有调用 send()）。
2：请求已发送，正在处理中（通常现在可以从响应中获取内容头）。
3：请求在处理中；通常响应中已有部分数据可用了，但是服务器还没有完成响应的生成。
4：响应已完成；您可以获取并使用服务器的响应了。

xmlhttp.status的值及解释：

100——客户必须继续发出请求
101——客户要求服务器根据请求转换HTTP协议版本
200——交易成功
201——提示知道新文件的URL
202——接受和处理、但处理未完成
203——返回信息不确定或不完整
204——请求收到，但返回信息为空
205——服务器完成了请求，用户代理必须复位当前已经浏览过的文件
206——服务器已经完成了部分用户的GET请求
300——请求的资源可在多处得到
301——删除请求数据
302——在其他地址发现了请求数据
303——建议客户访问其他URL或访问方式
304——客户端已经执行了GET，但文件未变化
305——请求的资源必须从服务器指定的地址得到
306——前一版本HTTP中使用的代码，现行版本中不再使用
307——申明请求的资源临时性删除
400——错误请求，如语法错误
401——请求授权失败
402——保留有效ChargeTo头响应
403——请求不允许
404——没有发现文件、查询或URl
405——用户在Request-Line字段定义的方法不允许
406——根据用户发送的Accept拖，请求资源不可访问
407——类似401，用户必须首先在代理服务器上得到授权
408——客户端没有在用户指定的饿时间内完成请求
409——对当前资源状态，请求不能完成
410——服务器上不再有此资源且无进一步的参考地址
411——服务器拒绝用户定义的Content-Length属性请求
412——一个或多个请求头字段在当前请求中错误
413——请求的资源大于服务器允许的大小
414——请求的资源URL长于服务器允许的长度
415——请求资源不支持请求项目格式
416——请求中包含Range请求头字段，在当前请求资源范围内没有range指示值，请求也不包含If-Range请求头字段
417——服务器不满足请求Expect头字段指定的期望值，如果是代理服务器，可能是下一级服务器不能满足请求
合起来
500——服务器产生内部错误
501——服务器不支持请求的函数
502——服务器暂时不可用，有时是为了防止发生系统过载
503——服务器过载或暂停维修
504——关口过载，服务器使用另一个关口或服务来响应用户，等待时间设定值较长
505——服务器不支持或拒绝支请求头中指定的HTTP版本
1xx:信息响应类，表示接收到请求并且继续处理
2xx:处理成功响应类，表示动作被成功接收、理解和接受
3xx:重定向响应类，为了完成指定的动作，必须接受进一步处理
4xx:客户端错误，客户请求包含语法错误或者是不能正确执行
5xx:服务端错误，服务器不能正确执行一个正确的请求
xmlhttp.readyState4 && xmlhttp.status200的解释：请求完成并且成功返回

xmlhttp的send是传递参数用的,但是只有在使用post方式提交请求的时候才有用；

用get方式请求：xmlhttp.send(null);

从服务端接收数组的 JSON 数据

如果从服务端接收的是数组的 JSON 数据，则 JSON.parse 会将其转换为 JavaScript 数组：

var xmlhttp = new XMLHttpRequest(); 
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 对象。

var text = '{ "name":"Runoob", "initDate":"2013-12-14", "site":"www.runoob.com"}'; //json字符串
var obj = JSON.parse(text); //将json数据转换为js对象
obj.initDate = new Date(obj.initDate);  //将字符串转换为date对象
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") {
    
    //value代表的是key的键值 
        return new Date(value);   //将value值转换为date对象返回 
    } else {
    
            
        return value; //必须返回这一步！
    }});  

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

使用 JSON.parse 的 reviver 函数时一定要注意遍历到最后的顶层对象 key 为 “”，需要返回 value。不然报错

解析函数

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

var text = '{
    
     
	"name":"Runoob", 
 	"alexa":"function () {return 10000;}", //将函数作为字符串存储
	"site":"www.runoob.com"}'; 
var obj = JSON.parse(text); //将json数据转换为js对象
obj.alexa = eval("(" + obj.alexa + ")");   //用eval解析函数字符串，将字符串转换为函数
document.getElementById("demo").innerHTML = obj.name + " Alexa 排名：" + obj.alexa();

不建议在 JSON 中使用函数

浏览器支持

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

Firefox 3.5
Internet Explorer 8
Chrome
Opera 10
Safari 4

JSON.stringify()

可以使用 JSON.stringify() 方法将 JavaScript 对象转换为字符串。

语法

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

参数说明：

value:

必需，要转换的 JavaScript 值（通常为对象或数组）。
replacer:

可选。用于转换结果的函数或数组。
- 如果 replacer 为函数，则 JSON.stringify 将调用该函数，并传入每个成员的键和值。使用返回值而不是原始值。如果此函数返回 undefined，则排除成员。根对象的键是一个空字符串：""。
- 如果 replacer 是一个数组，则仅转换该数组中具有键值的成员。成员的转换顺序与键在数组中的顺序一样。当 value 参数也为数组时，将忽略 replacer 数组。
space:

可选，文本添加缩进、空格和换行符，如果 space 是一个数字，则返回值文本在每个级别缩进指定数目的空格，如果 space 大于 10，则文本缩进 10 个空格。space 也可以使用非数字，如：\t。

JavaScript 对象转换

例如向服务器发送以下数据：

var obj = {
    
     "name":"runoob", "alexa":10000, "site":"www.runoob.com"};

使用 JSON.stringify() 方法处理以上数据，将其转换为字符串：

var myJSON = JSON.stringify(obj);//obj是js对象

myJSON 为字符串。

将 myJSON 发送到服务器：

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

JavaScript 数组转换

也可以将 JavaScript 数组转换为 JSON 字符串：

var arr = [ "Google", "Runoob", "Taobao", "Facebook" ]; //arr为js对象
var myJSON = JSON.stringify(arr);//myJSON 为字符串

将 myJSON 发送到服务器：

var arr = [ "Google", "Runoob", "Taobao", "Facebook" ]; 
var myJSON = JSON.stringify(arr); 
document.getElementById("demo").innerHTML = myJSON;

输出结果：[ “Google”, “Runoob”, “Taobao”, “Facebook” ]

异常

解析数据

JSON 不能存储 Date 对象。

JSON.stringify() 会将所有日期转换为字符串。

var obj = {
    
     "name":"Runoob", "initDate":new Date(), "site":"www.runoob.com"}; 
var myJSON = JSON.stringify(obj); //将js对象转换为字符串
document.getElementById("demo").innerHTML = myJSON;//initDate会返回当前时间！

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

解析函数

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

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);  //将转换后的js对象转换为json数据
document.getElementById("demo").innerHTML = myJSON;

不建议在 JSON 中使用函数。

浏览器支持

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

Firefox 3.5
Internet Explorer 8
Chrome
Opera 10
Safari 4

JSON 使用

把 JSON 文本转换为 JavaScript 对象

JSON 最常见的用法之一，是从 web 服务器上读取 JSON 数据（作为文件或作为 HttpRequest），将 JSON 数据转换为 JavaScript 对象，然后在网页中使用该数据。（读取-转换-使用三步）

JSON 实例 - 来自字符串的对象

创建包含 JSON 语法的 JavaScript 字符串：

var txt = '{ "sites" : [' + 
 '{ "name":"菜鸟教程" , "url":"www.runoob.com" },' + 
 '{ "name":"google" , "url":"www.google.com" },' + 
 '{ "name":"微博" , "url":"www.weibo.com" } ]}';

由于 JSON 语法是 JavaScript 语法的子集，JavaScript 函数 eval() 可用于将 JSON 文本转换为 JavaScript 对象。

eval() 函数使用的是 JavaScript 编译器，可解析 JSON 文本，然后生成 JavaScript 对象。必须把文本包围在括号中才能避免语法错误：

var obj = eval ("(" + txt + ")");

在网页中使用 JavaScript 对象，从 JSON 字符串中创建对象：

var txt = '{ "sites" : [' + 
'{ "name":"菜鸟教程" , "url":"www.runoob.com" },' + 
'{ "name":"google" , "url":"www.google.com" },' + 
'{ "name":"微博" , "url":"www.weibo.com" } ]}'; 

var obj = eval ("(" + txt + ")");  //将 JSON 文本转换为 JavaScript 

document.getElementById("name").innerHTML=obj.sites[0].name  document.getElementById("url").innerHTML=obj.sites[0].url

JSON 解析器

eval() 函数可编译并执行任何 JavaScript 代码。这隐藏了一个潜在的安全问题。
- 使用 JSON 解析器将 JSON 转换为 JavaScript 对象是更安全的做法。JSON 解析器只能识别 JSON 文本，而不会编译脚本。
- 在浏览器中，这提供了原生的 JSON 支持，而且 JSON 解析器的速度更快。
较新的浏览器和最新的 ECMAScript (JavaScript) 标准中均包含了原生的对 JSON 的支持。

Web 浏览器支持	Web 软件支持
Firefox (Mozilla) 3.5	jQuery
Internet Explorer 8	Yahoo UI
Chrome	Prototype
Opera 10	Dojo
Safari 4	ECMAScript 1.5

对于较老的浏览器，可使用 JavaScript 库： https://github.com/douglascrockford/JSON-js

JSON 格式最初是 originally specified by Douglas Crockford

在这里插入图片描述
如果对你有帮助的话不要忘记一键三连噢~
谢谢鸭~

初次编写于2021/2/25日；

【学习笔记】JSON学习笔记