JSON.stringify() 函數(shù)用于將 JavaScript 值轉(zhuǎn)換為 JSON 字符串。JSON (JavaScript 對象符號) 是一種輕量級的數(shù)據(jù)格式，易于在應(yīng)用程序之間傳輸和存儲數(shù)據(jù)。

語法

JSON.stringify(value, replacer, space)

其中： value： 要序列化的 JavaScript 值。它可以是對象、數(shù)組、字符串、數(shù)字或布爾值。 replacer： 可選參數(shù)，是一個函數(shù)或數(shù)組，用于自定義序列化過程。 space： 可選參數(shù)，指定生成的 JSON 字符串中的縮進(jìn)量。

示例 1：序列化簡單值

const value = {name: "John",age: 30
};const json= JSON.stringify(value);console.log(json); // {"name":"John","age":30}

示例 2：使用 replacer 函數(shù)

replacer 函數(shù)可以在序列化過程中替換或刪除屬性。

const value = {name: "John",age: 30,password: "secret"
};const replacer = (key, value) => {if (key === "password") {return undefined;} else {return value;}
};const json = JSON.stringify(value, replacer);console.log(json); // {"name":"John","age":30}

示例 3：使用空間選項

space 選項可以使生成的 JSON 字符串更容易閱讀。

const value = {name: "John",age: 30,address: {street: "Main Street",city: "Anytown"}
};const json = JSON.stringify(value, null, 2);console.log(json);
/
{"name": "John","age": 30,"address": {"street": "Main Street","city": "Anytown"}
}
/

JSON.parse()

JSON.parse() 函數(shù)用于將 JSON 字符串解析為 JavaScript 值。

JSON.parse() 的語法如下：

JSON.parse(tExt, reviver)

其中： text： 要解析的 JSON 字符串。 reviver： 可選參數(shù)，是一個函數(shù)，用于自定義解析過程。

示例：將 JSON 字符串解析為 JavaScript 對象：

const json = '{"name":"John","age":30}';const obj = JSON.parse(json);console.log(obj); // {name: "John", age: 30}

結(jié)論

JSON.stringify() 和 JSON.parse() 是將 JavaScript 數(shù)據(jù)存儲和傳輸為 JSON 字符串的強大工具。通過使用 replacer 和 space 選項，您可以定制序列化和解析過程以滿足您的特定需求。

---

關(guān)于JSON.parse(JSON.stringfy(object))進(jìn)行深拷貝的坑~

((object))就是利用 將js對象序列化（JSON字符串），再使用來反序列化（還原）js對象；序列化的作用是存儲(對象本身存儲的只是一個地址映射，如果斷電，對象將不復(fù)存在，因此需將對象的內(nèi)容轉(zhuǎn)換成字符串的形式再保存在磁盤上 )和傳輸。 關(guān)于使用時需要注意以下幾點： 1、如果object里面有 時間對象 ，則后再的結(jié)果，時間將只是字符串的形式。 而不是時間對象； 2、如果object里有 RegExp、Error對象 ，則序列化的結(jié)果將只得到空對象； 3、如果obj里有 函數(shù)、undefined、symbol ，則序列化的結(jié)果會把函數(shù)或 undefined丟失； 4、如果obj里有 NaN、Infinity和-Infinity ，則序列化的結(jié)果會變成null 5、()只能序列化對象的可枚舉的自有屬性，例如 如果obj中的對象是有 構(gòu)造函數(shù) 生成的， 則使用((obj))深拷貝后，會丟棄對象的 constructor ； 6、如果對象中存在 循環(huán)引用 的情況也無法正確實現(xiàn)深拷貝；

手寫JSON.parse和JSON.stringify

理解了有限狀態(tài)機，編寫各類解析器變得簡單，關(guān)鍵在于設(shè)計狀態(tài)轉(zhuǎn)換的邏輯。 手寫有兩大實現(xiàn)路徑，第一種是入門級，相對容易；第二種則是利用狀態(tài)機解析字符流，這需要了解一些編譯原理，否則理解起來可能較為困難。 初級版本的直接使用eval函數(shù)實現(xiàn)，但要注意在JSON字符串前后加上括號，否則會被誤認(rèn)為是代碼塊并報錯。 高級版本的主要利用有限狀態(tài)機進(jìn)行分詞，然后根據(jù)分詞數(shù)據(jù)構(gòu)建JSON對象。 分詞階段的狀態(tài)設(shè)計相對復(fù)雜，可以從簡單的狀態(tài)開始，逐步增加難度以完善代碼。 以下版本僅考慮了一些簡單場景，特別是嵌套數(shù)組，直接將其視為一個token，不支持內(nèi)部嵌套數(shù)組，以便于理解。 將分詞數(shù)組拼接成JSON，主要使用棧來緩存正在處理的對象。 在處理內(nèi)部嵌套的引用類型值時，需要記住父對象的key（子對象處理完畢后再賦值給父對象的key）。 這里我在讀取到key時，會在當(dāng)前對象上存儲key值，注意需要使用symbol類型添加屬性，否則可能會覆蓋對象中同名屬性。 在設(shè)置完對應(yīng)key的屬性值后，再刪除自己添加的這個symbol屬性。 也可以通過一個棧來存儲每次讀取到的key，每次設(shè)置值時出棧即為當(dāng)前要操作的key。 以下是測試效果的簡版，旨在展示核心原理。 它未處理許多異常情況，主要利用遞歸方法處理值中的對象和數(shù)組，其他基本數(shù)據(jù)類型則直接轉(zhuǎn)換為對應(yīng)的toString形式拼接。

一文徹底弄懂JSON.parse()與JSON.stringify()

深入理解 () 和 () 的功能和用法，對于對象與JSON字符串的交互至關(guān)重要。 這兩個方法在轉(zhuǎn)換和序列化過程中起著核心作用。

(): 從JSON字符串到對象

() 是將JSON字符串解析為JavaScript對象的關(guān)鍵工具。 最常見的用法是將字符串轉(zhuǎn)換為包含數(shù)據(jù)的對象。 然而，在特殊情況下，如計算員工高溫費，可通過reviver函數(shù)實現(xiàn)屬性過濾或刪除。 需要注意的是，如果輸入的JSON格式有誤，它會拋出SyntaxError異常。

(): 從對象到JSON字符串

與之相對，() 負(fù)責(zé)將JavaScript對象轉(zhuǎn)換為JSON字符串。 使用時，可以指定特定屬性進(jìn)行序列化，或者處理數(shù)組和非數(shù)組對象的轉(zhuǎn)換規(guī)則。 遇到循環(huán)引用或BigInt類型時，會引發(fā)TypeError異常。 MDN文檔提供了詳細(xì)的行為規(guī)范，包括值的序列化規(guī)則和異常處理。

其他應(yīng)用場景

關(guān)于vue中JSON.parse(JSON.stringify(...))使用深拷貝問題

在Vue開發(fā)中，((...)) 的組合使用常常被用來實現(xiàn)深拷貝操作，這里我們來詳細(xì)探討一下。 首先，() 和 () 分別有其獨特的功能：- () 是將一個JSON格式的字符串解析成JavaScript對象，例如：原始字符串: var str = {name:huahua,age:22};解析操作: (str);這會得到一個對象: var obj = {name:hua,age: 26};- 而 () 則是將JavaScript對象轉(zhuǎn)換成JSON格式的字符串。 當(dāng)你直接對一個對象執(zhí)行 ()，得到的字符串其實是一個淺拷貝，因為字符串只是引用了原始對象的地址。 為了實現(xiàn)深拷貝，即創(chuàng)建一個全新的對象并復(fù)制所有屬性，可以先將對象轉(zhuǎn)為字符串，再解析回對象，這樣就創(chuàng)建了獨立的新對象，即：深拷貝示例: = (())這樣做的效果是，即使原始對象（）有嵌套的對象或數(shù)組，深拷貝也會為這些內(nèi)容創(chuàng)建新的副本，確保在修改vueData時不會影響到原始對象（）。 總的來說，這是一種在Vue中實現(xiàn)對象深度復(fù)制的有效方法。

前端 JavaScript 對象與 json 字符串進(jìn)行轉(zhuǎn)換

JavaScript對象可通過使用()函數(shù)轉(zhuǎn)換為JSON字符串。 比如，我們有一個JavaScript對象：轉(zhuǎn)換結(jié)果如下：JSON字符串轉(zhuǎn)對象JSON字符串能夠通過()函數(shù)轉(zhuǎn)換回JavaScript對象。 例如，我們有一個JSON字符串：轉(zhuǎn)換結(jié)果如下：需要注意的是，JSON字符串必須符合JSON規(guī)范，否則會引發(fā)異常。 例如，以下JSON字符串中，屬性名不應(yīng)使用單引號：當(dāng)使用()方法時，將拋出異常“Uncaught SyntaxError”。

---

---

相關(guān)標(biāo)簽： 和json.parse、 JSON.stringify、 json.stringify、 將數(shù)據(jù)序列化為、 字符串、 入門、 JSON、

上一篇：JSONstringify實用指南高效轉(zhuǎn)換JavaScript

下一篇：JSONstringify的藝術(shù)將JavaScript對象轉(zhuǎn)換