>[success] # JSON * 一下內容都是選自mdn 和 js 高級程序設計書中的內容 ~~~ 1.一種輕量級的數據交換格式 2.用來序列化對象、數組、數值、字符串、布爾值和 null 3.不支持變量、函數或對象實例、JavaScript 中的特殊值 undefined。 4.Json 字符串只能用雙引號表示，json的key 也要加雙引號 ~~~ >[danger] ##### 解釋二三條 ~~~ // 將轉換成json 字符串的時候發現會將2，3條包含的內容進行處理 // 其實可以很好理解Json 是一種數據格式交互語言直接的交互最直接 // 肯定是定義共同的屬性才更具備交互，將js獨有的給到其他語言，其他 // 語言不支持其語法也是無用的 function Person(){ this.name='wang' } const person = new Person() var a = { xxx:function () { alert("1212") }, yyy: person, // 如果是實例的話只會顯示他的屬性 zzz: undefined, } console.log(JSON.stringify(a)) // 打印結果： {"yyy":{"name":"wang"}} ~~~ >[info] ## JSON.stringify [參考](https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/JSON/stringify) JSON.stringify()將值轉換為相應的JSON格式： * 轉換值如果有toJSON()方法，該方法定義什么值將被序列化。 * 非數組對象的屬性不能保證以特定的順序出現在序列化后的字符串中。 * 布爾值、數字、字符串的包裝對象在序列化過程中會自動轉換成對應的原始值。 * `undefined、`任意的函數以及 symbol 值，在序列化過程中會被忽略（出現在非數組對象的屬性值中時）或者被轉換成`null`（出現在數組中時）。函數、undefined被單獨轉換時，會返回undefined，如`JSON.stringify(function(){})`?or?`JSON.stringify(undefined).` * 對包含循環引用的對象（對象之間相互引用，形成無限循環）執行此方法，會拋出錯誤。 * 所有以 symbol 為屬性鍵的屬性都會被完全忽略掉，即便`replacer`參數中強制指定包含了它們。 * Date日期調用了toJSON()將其轉換為了string字符串（同Date.toISOString()），因此會被當做字符串處理。 * NaN和Infinity格式的數值及null都會被當做null。 * 其他類型的對象，包括Map/Set/weakMap/weakSet，僅會序列化可枚舉的屬性。 >[danger] ##### 對應技巧過濾想要字段 -- 數組 ~~~ 1.過濾器參數是數組，那么 JSON.stringify()的結果中將只包含數組中列出的屬性。 var book = { "title": "Professional JavaScript", "authors": [ "Nicholas C. Zakas" ], edition: 3, year: 2011 }; var jsonText = JSON.stringify(book, ["title", "edition"]); JSON.stringify()的第二個參數是一個數組，其中包含兩個字符串："title"和"edition"。這 兩個屬性與將要序列化的對象中的屬性是對應的，因此在返回的結果字符串中，就只會包含這兩個屬性： {"title":"Professional JavaScript","edition":3} ~~~ >[danger] ##### 對應技巧過濾想要字段 -- 函數 ~~~ var book = { "title": "Professional JavaScript", "authors": [ "Nicholas C. Zakas" ], edition: 3, year: 2011 }; var jsonText = JSON.stringify(book, function(key, value){ switch(key){ case "authors": return value.join(",") case "year": return 5000; case "edition": return undefined; default: return value; } }); 這里，函數過濾器根據傳入的鍵來決定結果。如果鍵為"authors"，就將數組連接為一個字符串； 如果鍵為"year"，則將其值設置為 5000；如果鍵為"edition"，通過返回 undefined 刪除該屬性。 最后，一定要提供 default 項，此時返回傳入的值，以便其他值都能正常出現在結果中。實際上，第 一次調用這個函數過濾器，傳入的鍵是一個空字符串，而值就是 book 對象。序列化后的 JSON 字符串 如下所示： {"title":"Professional JavaScript","authors":"Nicholas C. Zakas","year":5000} ~~~ >[danger] ##### console.log 更好看效果 ~~~ var book = { "title": "Professional JavaScript", "authors": [ "Nicholas C. Zakas" ], "edition": 3, "year": 2011 } var jsonText = JSON.stringify(book, null, 4); JSONStringifyExample03.htm 保存在 jsonText 中的字符串如下所示： { "title": "Professional JavaScript", "authors": [ "Nicholas C. Zakas" ], "edition": 3, "year": 2011 } ~~~ >[info] ## JSON.parse 反序列化 [反序列化參看](https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/JSON/parse) >[danger] ##### 技巧 ~~~ 如果還原函數返回 undefined，則表示要從結果中刪除相應的鍵；如果返回其他值，則將該值插 入到結果中。在將日期字符串轉換為 Date 對象時，經常要用到還原函數。例如： var book = { "title": "Professional JavaScript", "authors": [ "Nicholas C. Zakas" ], edition: 3, year: 2011, releaseDate: new Date(2011, 11, 1) }; var jsonText = JSON.stringify(book); var bookCopy = JSON.parse(jsonText, function(key, value){ if (key == "releaseDate"){ return new Date(value); } else { return value; } }); alert(bookCopy.releaseDate.getFullYear()); 以上代碼先是為 book 對象新增了一個 releaseDate 屬性，該屬性保存著一個 Date 對象。這個 對象在經過序列化之后變成了有效的 JSON 字符串，然后經過解析又在 bookCopy 中還原為一個 Date 對象。還原函數在遇到"releaseDate"鍵時，會基于相應的值創建一個新的 Date 對象。結果就是 bookCopy.releaseDate 屬性中會保存一個 Date 對象。正因為如此，才能基于這個對象調用 getFullYear()方法。 ~~~