1.電腦系統 windows10專業版
2.JSON對象有兩個方法:stringify()和parse()在簡單的狀況下,這兩個方法分別能夠將JavaScript 序列化爲 JSON 字符串,以及將 JSON 解析爲原生 JavaScript 值。下面我來分享一下使用方法。
3.基本使用:json
let book = { title: "Professional JavaScript", authors: [ "Nicholas C. Zakas", "Matt Frisbie" ], edition: 4, year: 2017 }; let jsonText = JSON.stringify(book);
這個例子使用 JSON.stringify()把一個 JavaScript 對象序列化爲一個 JSON 字符串,保存在變量 jsonText 中。默認狀況下,JSON.stringify()會輸出不包含 空格或縮進的 JSON 字符串,所以jsonText 的值是這樣的:
{"title":"Professional JavaScript","authors":["Nicholas C. Zakas","Matt Frisbie"], "edition":4,"year":2017}
4.注意:windows
在序列化 JavaScript 對象時,全部函數和原型成員都會有 意地在結果中省略。 此外,值爲 undefined 的任何屬性也會被跳過。 最終獲得的就是全部實例屬性均爲有效 JSON 數據類型的表示。
5.JSON 字符串能夠直接傳給 JSON.parse(),而後獲得相應的 JavaScript 值,好比,可使用如下代碼建立與 book 對象相似的新對象:數組
let bookCopy = JSON.parse(jsonText);
注意,book 和 bookCopy 是兩個徹底不一樣的對象,沒有任何關係。可是它們擁有相同的屬性和值。 若是給 JSON.parse()傳入的 JSON 字符串無效,則會致使拋出錯誤。
6.序列化選項瀏覽器
實際上,JSON.stringify()方法除了要序列化的對象,還能夠接收兩個參數。 這兩個參數能夠用於指定其餘序列化 JavaScript 對象的方式。 第一個參數是過濾器,能夠是數組或函數; 第二個參數是用於縮進結果 JSON 字符串的選項。 單獨或組合使用這些參數能夠更好地控制 JSON 序列化。
7.1. 過濾結果:數組
若是第二個參數是一個數組,那麼 JSON.stringify()返回的結果只會包含該數組中列出的對象
屬性。好比下面的例子:數據結構
let book = { title: "Professional JavaScript", authors: [ "Nicholas C. Zakas", "Matt Frisbie" ], edition: 4, year: 2017 }; let jsonText = JSON.stringify(book, ["title", "edition"]);
在這個例子中,JSON.stringify()方法的第二個參數是一個包含兩個字符串的數組:"title"和"edition"。它們對應着要序列化的對象中的屬性,所以結果 JSON 字符串中只會包含這兩個屬性:
{"title":"Professional JavaScript","edition":4}
7.2. 過濾結果:函數函數
若是第二個參數是一個函數,則行爲又有不一樣。 提供的函數接收兩個參數:屬性名(key)和屬性值(value)。 能夠根據這個 key 決定要對相應屬性執行什麼操做。 這個 key 始終是字符串,只是在值 不屬於某個鍵/值對時會是空字符串。
爲了改變對象的序列化,返回的值就是相應 key 應該包含的結果。 注意,返回 undefined 會致使 屬性被忽略。下面看一個例子:
let book = { title: "Professional JavaScript", authors: [ "Nicholas C. Zakas", "Matt Frisbie" ], edition: 4, year: 2017 }; let jsonText = JSON.stringify(book, (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 忽略該屬性。 最後必定要提供默認返回值,以便返回其餘屬性傳入的值。 第一次調用這個函數實際上會傳入空字符串 key,值是 book 對象。 最終獲得的 JSON 字符串是這樣的:
{"title":"Professional JavaScript","authors":"Nicholas C. Zakas,Matt Frisbie","year":5000}
注意,函數過濾器會應用到要序列化的對象所包含的全部對象, 所以若是數組中包含多個具備這些 屬性的對象,則序列化以後每一個對象都只會剩下上面這些屬性。
7.3. 字符串縮進this
JSON.stringify()方法的第三個參數控制縮進和空格。在這個參數是數值時,表示每一級縮進的 空格數。例如,每級縮進 4 個空格,能夠這樣
let book = { title: "Professional JavaScript", authors: [ "Nicholas C. Zakas", "Matt Frisbie" ], edition: 4, year: 2017 }; let jsonText = JSON.stringify(book, null, 4);
// 這樣獲得的 jsonText 格式以下: { "title": "Professional JavaScript", "authors": [ "Nicholas C. Zakas", "Matt Frisbie" ], "edition": 4, "year": 2017 }
注意,除了縮進,JSON.stringify()方法還爲方便閱讀插入了換行符。這個行爲對於全部有效的縮進參數都會發生。(只縮進不換行也沒什麼用。)最大縮進值爲 10,大於 10 的值會自動設置爲 10。
若是縮進參數是一個字符串而非數值,那麼 JSON 字符串中就會使用這個字符串而不是空格來縮進。使用字符串,也能夠將縮進字符設置爲 Tab 或任意字符,如兩個連字符:
let jsonText = JSON.stringify(book, null, "--" );
這樣,jsonText 的值會變成以下格式: { --"title": "Professional JavaScript", --"authors": [ ----"Nicholas C. Zakas", ----"Matt Frisbie" --], --"edition": 4, --"year": 2017 }
注意:使用字符串時一樣有 10 個字符的長度限制。若是字符串長度超過 10,則會在第 10 個字符處截斷。
7.4. toJSON()方法code
有時候,對象須要在 JSON.stringify()之上自定義 JSON 序列化。此時,能夠在要序列化的對象 中添加 toJSON()方法,序列化時會基於這個方法返回適當的 JSON 表示。事實上,原生 Date 對象就 有一個 toJSON()方法,可以自動將 JavaScript 的 Date 對象轉換爲 ISO 8601 日期字符串(本質上與在 Date 對象上調用 toISOString()方法同樣)。
下面的對象爲自定義序列化而添加了一個 toJSON()方法: let book = { title: "Professional JavaScript", authors: [ "Nicholas C. Zakas", "Matt Frisbie" ], edition: 4, year: 2017, toJSON: function() { return this.title; } }; let jsonText = JSON.stringify(book);
這裏 book 對象中定義的 toJSON()方法簡單地返回了圖書的書名 (this.title) 與 Date 對象相似,這個對象會被序列化爲簡單字符串而非對象。 toJSON()方法能夠返回任意序列化值,均可以起到相應的做用。 若是對象被嵌入在另外一個對象中,返回 undefined 會致使值變成 null; 或者若是是頂級對象,則自己就是 undefined。 注意,箭頭函數不能用來定義 toJSON()方法。 主要緣由是箭頭函數 的詞法做用域是全局做用域,在這種狀況下不合適。
toJSON()方法能夠與過濾函數一塊兒使用,所以理解不一樣序列化流程的順 序很是重要。 在把對象傳給 JSON.stringify()時會執行以下步驟。 (1) 若是能夠獲取實際的值,則調用 toJSON()方法獲取實際的值, 不然使用默認的序列化。 (2) 若是提供了第二個參數,則應用過濾。 傳入過濾函數的值就是第(1)步返回的值。 (3) 第(2)步返回的每一個值都會相應地進行序列化。 (4) 若是提供了第三個參數,則相應地進行縮進。 理解這個順序有助於決定是建立 toJSON()方法, 仍是使用過濾函數,抑或是二者都用。
8.解析選項對象
JSON.parse()方法也能夠接收一個額外的參數,這個函數會針對每一個鍵/值對都調用一次。爲區別 於傳給 JSON.stringify()的起過濾做用的替代函數(replacer),這個函數被稱爲還原函數(reviver)。 實際上它們的格式徹底同樣,即還原函數也接收兩個參數,屬性名(key)和屬性值(value),另外也 須要返回值。
若是還原函數返回 undefined,則結果中就會刪除相應的鍵。若是返回了其餘任何值,則該值就 會成爲相應鍵的值插入到結果中。還原函數常常被用於把日期字符串轉換爲 Date 對象。例如:
let book = { title: "Professional JavaScript", authors: [ "Nicholas C. Zakas", "Matt Frisbie" ], edition: 4, year: 2017, releaseDate: new Date(2017, 11, 1) }; let jsonText = JSON.stringify(book); let bookCopy = JSON.parse(jsonText, (key, value) => key == "releaseDate" ? new Date(value) : value); alert(bookCopy.releaseDate.getFullYear());
以上代碼在 book 對象中增長了 releaseDate 屬性,是一個 Date 對象。 這個對象在被序列化爲JSON 字符串後,又被從新解析爲一個對象 bookCopy。 這裏的還原函數會查找"releaseDate"鍵,如 果找到就會根據它的日期字符串建立新的 Date 對象。 獲得的 bookCopy.releaseDate 屬性又變回了 Date 對象,所以能夠調用其 getFullYear()方法。
9.總結ip
JSON 是一種輕量級數據格式,能夠方便地表示覆雜數據結構。 這個格式使用 JavaScript 語法的一個 子集表示對象、數組、字符串、數值、布爾值和 null。雖然 XML 也能勝任一樣的角色,但 JSON 更簡 潔,JavaScript 支持也更好。 更重要的是,全部瀏覽器都已經原生支持全局 JSON 對象。 ECMAScript 5 定義了原生 JSON 對象,用於將 JavaScript 對象序列化爲 JSON 字符串,以及將 JSON 數組解析爲 JavaScript 對象。 JSON.stringify()和 JSON.parse()方法分別用於實現這兩種操做。 這兩個方法都有一些選項能夠用來改變默認的行爲,以實現過濾或修改流程。