1. JSON 是什麼？

JSON，全稱是 JavaScript Object Notation，即 JavaScript對象標記法。
JSON是一種輕量級（Light-Meight)、基於文本的(Text-Based)、可讀的(Human-Readable)格式。
JSON 的名稱中雖然帶有JavaScript，但這是指其語法規則是參考JavaScript對象的，而不是指只能用於JavaScript 語言。
JSON無論對於人，還是對於機器來說，都是十分便於閱讀和書寫的，而且相比 XML(另一種常見的數據交換格式)，文件更小，因此迅速成為網路上十分流行的交換格式。
近年來JavaScript已經成為瀏覽器上事實上的標準語言，JavaScript 的風靡，與JSON 的流行也有密切的關係。
因為JSON本身就是參考JavaScript 對象的規則定義的，其語法與JavaScript定義對象的語法幾乎完全相同。
JSON格式的創始人聲稱此格式永遠不升級，這就表示這種格式具有長時間的穩定性，10 年前寫的文件，10年後也能用,沒有任何兼容性問題。

2. JSON 的語法規則是怎樣的？

JSON 的語法規則十分簡單，可稱得上「優雅完美」，總結起來有：

數組（Array）用方括弧(「[]」)表示。
對象（0bject）用大括弧(「{}」)表示。
名稱/值對(name/value）組合成數組和對象。
名稱(name）置於雙引號中，值（value）有字元串、數值、布爾值、null、對象和數組。
並列的數據之間用逗號(「,」）分隔

{
	"name": "xdr630",
	"favorite": "programming"
}

3. JSON 和 XML

JSON常被拿來與XML做比較，因為JSON 的誕生本來就多多少少要有取代XNL的意思。相比 XML，JSON的優勢如下:

沒有結束標籤,長度更短,讀寫更快
能夠直接被JavaScript解釋器解析
可以使用數組

兩者比較

JSON：

{
	"name":"兮動人",
	"age":22,
	"fruits":["apple","pear","grape"]
}

XML：

<root>
	<name>兮動人</name>
	<age>22</age>
	<fruits>apple</fruits>
	<fruits>pear</fruits>
	<fruits>grape</fruits>
</root>

4. JSON的解析和生成（JSON 和 JS 對象互轉）

在JavaScript中，有兩個方法與此相關: JSON.parse和 JSON.stringify 。

JSON 和 JS 對象互轉

要實現從JSON字元串轉換為JS對象，使用 JSON.parse() 方法：

<script>
	var str = '{"name": "兮動人","age":22}';
	var obj = JSON.parse(str);
	console.log(obj);
</script>

要實現從JS對象轉換為JSON字元串，使用 JSON.stringify() 方法：

<script>
	var str = '{"name": "兮動人","age":22}';
	var obj = JSON.parse(str);
	console.log(obj);
        
	var jsonstr = JSON.stringify(obj);
	console.log(jsonstr);
</script>

5. JSON格式規定

1、對象（0bject)

對象用大括弧(「{}」）括起來，大括弧里是一系列的「名稱/值對」，請看概念圖。
兩個並列的數據之間用逗號(「,」）隔開，注意兩點:

使用英文的逗號（「,」)，不要用中文的逗號(「，」)
最後一個「名稱/值對「之後不要加逗號

JSON在線檢查語法：https://www.json.cn/
這裡報錯說明JSON中Key/Value不能使用單引號
正確寫法 2、數組（Array）
數組表示一系列有序的值，用方括弧(「[]」)包圍起來，並列的值之間用逗號分隔，請看概念圖。
例如，以下的數組是合法的:

[1,2,"three","four",true,false,null,[1,2],{"name":"兮動人"}]

3、名稱/值對（Name/Value）

名稱（Name）是一個字元串，要用雙引號括起來，不能用單引號，也不能沒有引號，這一點與JavaScript不同。
值的類型只有七種:字元串（string)、數值(number)、對象（object)、數組（array), true、false、null。不能有這之外的類型，例如undefined、函數等。請看概念圖。

字元串（string）的規則如下:

英文雙引號括起來,不能用單引號，也不能沒有。
字元串中不能單獨出現雙引號（」）和右斜杠（「”)。
如果要打雙引號或右斜杠，需要使用「右斜杠+字元」的形式，例如」和\，其它的轉義字元也是如此字元串的概念圖。

轉義字元

{
"string":"\ " "
}

數值類型，可以使用科學計數法表示

{
"number":1e3,
"n1":1e2,
"n2":-100
}

6. 字元串轉化成對象

解析：是指將符合JSON 語法規則的字元串轉換成對象的過程。
不同的編程語言都提供了解析JSON字元串的方法，在這裡主要講解JavaScript中的解析方法。主要有三種:

使用eval()
使用JSON.parse()
使用第三方庫,例如JQuery等

1、 eval()

eval(）函數的參數是一個字元串，其作用是直接執行其中的 JavaScript代碼。
案例：eval()解析字元串

<script>
	var str = "console.log('hello')";
	eval(str);
</script>

eval 解析字元串的結果：

eval(）能夠解析JSON字元串。從這裡也可以看得出，JSON 和JavaScript是高度嵌合的。
案例：eval()解析JSON字元串

<script>
	var str = '{"name":"兮動人","age":22}';
	var obj = eval("("+str+")");
	console.log(obj)
</script>

但是,現在已經很少直接使用eval()來解析了，如果您的瀏覽器版本真的是很舊，可能才需要這個方法。此外，eval()是一個相對危險的函數，因為字元串中可能含有未知因素。在這裡，作為學習，還是要知道這也是一種方法。
請注意 eval()的參數，在字元串兩旁加了括弧，這是必須的，否則會報錯。
因為JSON字元串是被大括弧（「{}」）包圍的，直接放到 eval()會被當成語句塊來執行，因此要在兩旁加上括弧，使其變成表達式。

2、JSON. parse()

現在絕大多數瀏覽器都以支持JSON.parse()，是推薦使用的方式。
如果輸入了不符合規範的字元串,會報錯。

案例：JSON字元串轉換為JS對象

<script>
	var str = '{"name":"兮動人","age":22}';
	var obj = JSON.parse(str)
	console.log(obj)
</script>

JSON.parse()可以有第二個參數，是一個函數。此函數有兩個參數:name和value，分別代表名稱和值。當傳入一個JSON字元串後，JSON的每一組名稱/值對都要調用此函數。該函數有返回值，返回值將賦值給當前的名稱(name)。
利用第二個參數，可以在解析JSON字元串的同時對數據進行一些處理。

案例：

<script>
	var str = '{"name":"兮動人","age":22}';
	var obj = JSON.parse(str,fun);
	function fun(name,value){
		console.log(name+":"+value);
		return value
	}
	console.log(obj)
</script>

可以做判斷處理，當JSON字元串的 name=age 時，設置age的value=14

<script>
	var str = '{"name":"兮動人","age":22}';
	var obj = JSON.parse(str,fun);
	function fun(name,value){
	if (name == "age")
		value = 14;
		return value
	}
 	console.log(obj)
</script>

7. JS對象轉化為字元串

序列化，指將 JavaScript 值轉化為JSON字元串的過程。
JSON.stringify(）能夠將JavaScript值轉換成JSON字元串。JSON.stringify()生成的字元串可以用JSON.parse()再還原成JavaScript值。

1、參數的含義

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

value:必選參數。被變換的JavaScript值，一般是對象或數組。
replace:可以省略。有兩種選擇:函數或數組。

如果是函數，則每一組名稱/值對都會調用此函數，該函數返回一個值，作為名稱的值變換到結果字元串中,如果返回undefined，則該成員被忽略。

案例：

<script>
        var obj = {
            name: "兮動人",
            age: 22
        };
        console.log(obj);

        var jsonstr = JSON.stringify(obj,fun);

        function fun(name,value) {
            if (name=="age")
                value = 18;
                return value;
         }

        console.log(jsonstr)

</script>

如果是數組，則只有數組中存在名稱才能夠被轉換，且轉換後順序與數組中的值保持一致。
案例：

<script>
        var obj = {
            a: 1,
            b: 2,
            c: 3,
            d: 4
        };
        console.log(obj);

        var jsonstr = JSON.stringify(obj,["a","b","c"]);
        
        console.log(jsonstr)
</script>

把順序改下，對應轉換的JSON字元串的數值不變

var jsonstr = JSON.stringify(obj,["c","a","b"]);

space:可以省略。這是為了排版、方便閱讀而存在的。可以在JSON字元串中添加空白或製表符等。

2、value的用法

<script>
var obj = {
            name: "兮動人",
            age: 22
        }
	console.log(obj);
	var jsonstr = JSON.stringify(obj);
	console.log(jsonstr)
</script>

當有不符合JSON語法規則時，就不會被轉換成JSON字元串。
數組中有函數時會被轉換成 null

<script>
	var obj = {
            name: "兮動人",
            age: 22,
            a: undefined,
            f: function () {

            },
            b:[function () {}]
        }
	console.log(obj);
	var jsonstr = JSON.stringify(obj);
	console.log(jsonstr)        
</script>

3、replace的用法

4、space的用法

案例：在上面的基礎上添加

<script>
        var obj = {
            a: 1,
            b: 2,
            c: 3,
            d: 4
        };
        console.log(obj);

        var jsonstr = JSON.stringify(obj,["c","a","b"],"one");

        console.log(jsonstr)
</script>

改成製表符：t

<script>
        var obj = {
            a: 1,
            b: 2,
            c: 3,
            d: 4
        };
        console.log(obj);

        var jsonstr = JSON.stringify(obj,["c","a","b"],"t");

        console.log(jsonstr)
</script>