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)用方括号(“<code>[]</code>”)表示。
對象(0bject)用大括号(“<code>{}</code>”)表示。
名稱/值對(<code>name/value</code>)組合成數組和對象。
名稱(<code>name</code>)置于雙引号中,值(<code>value</code>)有字元串、數值、布爾值、null、對象和數組。
并列的資料之間用逗号(“<code>,</code>”)分隔
3. JSON 和 XML
JSON常被拿來與XML做比較,因為JSON 的誕生本來就多多少少要有取代XNL的意思。相比 XML,JSON的優勢如下:
沒有結束标簽,長度更短,讀寫更快
能夠直接被JavaScript解釋器解析
可以使用數組
兩者比較
JSON:
XML:
4. JSON的解析和生成(JSON 和 JS 對象互轉)
在JavaScript中,有兩個方法與此相關: <code>JSON.parse</code>和 <code>JSON.stringify</code> 。
JSON 和 JS 對象互轉
要實作從JSON字元串轉換為JS對象,使用 <code>JSON.parse()</code> 方法:

要實作從JS對象轉換為JSON字元串,使用 <code>JSON.stringify()</code> 方法:
5. JSON格式規定
1、對象(0bject)
對象用大括号(“<code>{}</code>”)括起來,大括号裡是一系列的“<code>名稱/值對</code>”,請看概念圖。
兩個并列的資料之間用逗号(“<code>,</code>”)隔開,注意兩點:
使用英文的逗号(“<code>,</code>”),不要用中文的逗号(“<code>,</code>”)
最後一個“<code>名稱/值對</code>“之後不要加逗号
JSON線上檢查文法:https://www.json.cn/
這裡報錯說明JSON中Key/Value不能使用單引号
正确寫法
2、數組(Array)
數組表示一系列有序的值,用方括号(“<code>[]</code>”)包圍起來,并列的值之間用逗号分隔,請看概念圖。
例如,以下的數組是合法的:
3、名稱/值對(Name/Value)
名稱(Name)是一個字元串,要用雙引号括起來,不能用單引号,也不能沒有引号,這一點與JavaScript不同。
值的類型隻有七種:<code>字元串(string)、數值(number)、對象(object)、數組(array), true、false、null</code>。不能有這之外的類型,例如u<code>ndefined、函數</code>等。請看概念圖。
字元串(<code>string</code>)的規則如下:
英文雙引号括起來,不能用單引号,也不能沒有。
字元串中不能單獨出現雙引号(<code>”</code>)和右斜杠(“<code>\</code>")。
如果要打雙引号或右斜杠,需要使用“<code>右斜杠+字元</code>”的形式,例如<code>\”</code>和<code>\\</code>,其它的轉義字元也是如此字元串的概念圖。
轉義字元
數值類型,可以使用科學計數法表示
6. 字元串轉化成對象
解析:是指将符合JSON 文法規則的字元串轉換成對象的過程。
不同的程式設計語言都提供了解析JSON字元串的方法,在這裡主要講解JavaScript中的解析方法。主要有三種:
使用<code>eval()</code>
使用<code>JSON.parse()</code>
使用第三方庫,例如JQuery等
1、 <code>eval()</code>
<code>eval()</code>函數的參數是一個字元串,其作用是直接執行其中的 JavaScript代碼。
案例:eval()解析字元串
eval 解析字元串的結果:
eval()能夠解析JSON字元串。從這裡也可以看得出,JSON 和JavaScript是高度嵌合的。
案例:eval()解析JSON字元串
但是,現在已經很少直接使用eval()來解析了,如果您的浏覽器版本真的是很舊,可能才需要這個方法。此外,eval()是一個相對危險的函數,因為字元串中可能含有未知因素。在這裡,作為學習,還是要知道這也是一種方法。
請注意 eval()的參數,在字元串兩旁加了括号,這是必須的,否則會報錯。
因為JSON字元串是被大括号(“<code>{}</code>”)包圍的,直接放到 <code>eval()</code>會被當成語句塊來執行,是以要在兩旁加上括号,使其變成表達式。
2、<code>JSON. parse()</code>
現在絕大多數浏覽器都以支援<code>JSON.parse()</code>,是推薦使用的方式。
如果輸入了不符合規範的字元串,會報錯。
案例:JSON字元串轉換為JS對象
<code>JSON.parse()</code>可以有第二個參數,是一個函數。此函數有兩個參數:<code>name和value</code>,分别代表名稱和值。當傳入一個JSON字元串後,JSON的每一組<code>名稱/值對</code>都要調用此函數。該函數有傳回值,傳回值将指派給目前的名稱(name)。
利用第二個參數,可以在解析JSON字元串的同時對資料進行一些處理。
案例:
可以做判斷處理,當JSON字元串的 name=age 時,設定age的value=14
7. JS對象轉化為字元串
序列化,指将 JavaScript 值轉化為JSON字元串的過程。
<code>JSON.stringify()</code>能夠将JavaScript值轉換成JSON字元串。<code>JSON.stringify()</code>生成的字元串可以用<code>JSON.parse()</code>再還原成JavaScript值。
1、參數的含義
<code>value</code>:必選參數。被變換的JavaScript值,一般是對象或數組。
<code>replace</code>:可以省略。有兩種選擇:函數或數組。
如果是函數,則每一組名稱/值對都會調用此函數,該函數傳回一個值,作為名稱的值變換到結果字元串中,如果傳回<code>undefined</code>,則該成員被忽略。
如果是數組,則隻有數組中存在名稱才能夠被轉換,且轉換後順序與數組中的值保持一緻。
把順序改下,對應轉換的JSON字元串的數值不變
<code>space</code>:可以省略。這是為了排版、友善閱讀而存在的。可以在JSON字元串中添加空白或制表符等。
2、value的用法
當有不符合JSON文法規則時,就不會被轉換成JSON字元串。
數組中有函數時會被轉換成 <code>null</code>
3、replace的用法
4、space的用法
案例:在上面的基礎上添加
改成制表符:<code>\t</code>