【JSON】简介、与XML异同、语法格式、在JavaScript中使用JSON

前言：整体知识体系，与部分具体概念的参考来源如下
菜鸟教程：https://www.runoob.com/json/json-tutorial.html
百度百科：https://baike.baidu.com/item/JSON/2462549?fr=aladdin

一、JSON简介

JSON: JavaScript Object Notation(JavaScript对象表示法， JavaScript对象简谱)是一种轻量级的数据交换格式。

• 它基于ECMAScript (欧洲计算机协会制定的js规范)的一个子集。
• 采用完全独立于编程语言的文本格式存储和表示数据。简洁和清晰的层次结构使得JSON成为理想的数据交换语言。 易于人阅读和编写，同时也易于机器解析和生成，并有效地提升网络传输效率。
• JSON独立于语言，使用Javascript语法来描述数据对象，但是JSON仍然独立于语言和平台。JSON解析器和JSON库支持许多不同的编程语言。 目前非常多的动态（PHP，JSP，.NET）编程语言都支持JSON。

二、比较JSON与XML

JSON例子

{
  "students": [
    { "name": "zlc", "age": 20 },
    { "name": "tom", "age": 19}
  ]
}

XML例子

<students>
    <student>
        <name>zlc</name>
        <age>20</age>
    </student>
    <student>
        <name>tom</name>
        <age>19</age>
    </student>
</students>

1.相同点

JSON和XML都用于接收web服务端的数据。它们的数据都是 “自我描述” ，有层次的结构，都易于人理解，二者的数据也可以被大多数编程语言使用。

2.不同点

（1）JSON比XML更小、更快，更易解析，而且不需要结束标签、更加简短、读写速度更快、可以使用数组。

（2）XML需要使用XML解析器来解析（步骤：获取 XML 文档，使用XML DOM迭代循环文档，接数据解析出来复制给变量），JSON可以使用标准的JavaScript函数来解析（步骤：获取JSON字符串，JSON.parse(): 将一个JSON字符串转换为JavaScript对象；JSON.stringify(): 于将JavaScript值转换为JSON字符串）。

三、JSON语法格式

1.对象

格式：“key” : value

键：

• 必须用双引号括起

值：

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

2.数组

3.对象 + 数组

这种对象嵌数组，或数组嵌对象的写法在JS中很常见，可读性很强，因为总而言之JSON也就是用JS语法描述的有层次感的数据格式，例如在Vue.js中

再放一个菜鸟教程上的例子

四、在JavaScript中使用JSON

1.JSON文本串–>JS对象

var strObj = JSON.parse(JSON文本串);

2.JS对象–>JSON文本串

var objStr = JSON.stringify(obj);

3.操作JSON对象

let myObj, x, xIn;
myObj = {
    "name": "zlc",
    "age": 20,
    "plan": {
        "Monday":"study",
        "Tuesday":"read",
    }
};

/*
----------访问对象值----------
 */
x = myObj.name; // 或 x = myObj["name"];
xIn = myObj.plan.Monday;

/*
----------修改对象值----------
 */
myObj.name = 'Zhou_LC'; // myObj["name"] = 'Zhou_LC';

/*
----------删除对象属性----------
 */
delete myObj.name;

/*
----------循环对象（默认操作键）------------
 */
for (x in myObj) {
    document.getElementById("demo").innerHTML += myObj[x] + "<br/>";
}

4.操作JSON数组

let myObj, x, xIn;
myObj = {
    "name": "zlc",
    "age": 20,
    "hobby": [ "read", "study" ]
};

/*
----------访问数组元素----------
 */
x = myObj.hobby[0];

/*
----------修改数组元素----------
 */
myObj.hobby[0] = 'play';

/*
----------删除数组元素----------
 */
delete myObj.hobby[0];

/*
----------循环数组元素------------
 */
for (let i in myObj.hobby) {
    x += myObj.hobby[i] + "<br/>";
}
for (let i = 0; i < myObj.hobby.length; i++) {
    x += myObj.hobby[i] + "<br/>";
}