前言

JSON.stringify() 方法將一個(gè) JavaScript 對(duì)象或值轉(zhuǎn)換為 JSON 字符串，如果指定了一個(gè) replacer 函數(shù)，則可以選擇性地替換值，或者指定的 replacer 是數(shù)組，則可選擇性地僅包含數(shù)組指定的屬性。

語法如下：

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

• 第一個(gè)參數(shù) value：將要序列化成 一個(gè) JSON 字符串的值。
• 第二個(gè)參數(shù) replacer：可選參數(shù)，如果該參數(shù)是一個(gè)函數(shù)，則在序列化過程中，被序列化的值的每個(gè)屬性都會(huì)經(jīng)過該函數(shù)的轉(zhuǎn)換和處理；如果該參數(shù)是一個(gè)數(shù)組，則只有包含在這個(gè)數(shù)組中的屬性名才會(huì)被序列化到最終的 JSON 字符串中；如果該參數(shù)為 null 或者未提供，則對(duì)象所有的屬性都會(huì)被序列化。
• 第三個(gè)參數(shù) space：可選參數(shù)，指定縮進(jìn)用的空白字符串，用于美化輸出（pretty-print）；如果參數(shù)是個(gè)數(shù)字，它代表有多少的空格；上限為 10。該值若小于 1，則意味著沒有空格；如果該參數(shù)為字符串（當(dāng)字符串長(zhǎng)度超過 10 個(gè)字母，取其前 10 個(gè)字母），該字符串將被作為空格；如果該參數(shù)沒有提供（或者為 null），將沒有空格。

第二個(gè)參數(shù)replacer 為數(shù)組

是的，JSON.stringify() 函數(shù)可以有第二個(gè)參數(shù)，它是要在控制臺(tái)中打印的對(duì)象的鍵數(shù)組。下面來看看示例：

const arrayData = [
    {
        id: "0001",
        type: "donut",
        name: "Cake",
        ppu: 0.55,
        batters: {
            batter: [
                { id: "1001", type: "Regular" },
                { id: "1002", type: "Chocolate" },
                { id: "1003", type: "Blueberry" },
                { id: "1004", type: "Devil's Food" },
            ],
        },
        topping: [
            { id: "5001", type: "None" },
            { id: "5002", type: "Glazed" },
            { id: "5005", type: "Sugar" },
            { id: "5007", type: "Powdered Sugar" },
            { id: "5006", type: "Chocolate with Sprinkles" },
            { id: "5003", type: "Chocolate" },
            { id: "5004", type: "Maple" },
        ],
    },
];
console.log(JSON.stringify(arrayData, ["name"])); // [{"name":"Cake"}]

可以通過在第二個(gè)參數(shù)中將其作為數(shù)組傳遞僅需要打印的鍵，而不需要打印整個(gè) JSON 對(duì)象。

第二個(gè)參數(shù)replacer 為函數(shù)

還可以將第二個(gè)參數(shù)作為函數(shù)傳遞，根據(jù)函數(shù)中編寫的邏輯評(píng)估每個(gè)鍵值對(duì)。如果返回 undefined 鍵值對(duì)將不會(huì)打印。請(qǐng)看下面示例：

const user = {
    name: "DevPoint",
    age: 35,
};

const result = JSON.stringify(user, (key, value) =>
    typeof value === "string" ? undefined : value
);
console.log(result); // {"age":35}

上述代碼的輸出，可以用來過濾 JSON 數(shù)據(jù)的屬性值。

第三個(gè)參數(shù)為 Number

第三個(gè)參數(shù)控制最終字符串中的間距。如果參數(shù)是一個(gè)數(shù)字，則字符串化中的每個(gè)級(jí)別都將縮進(jìn)此數(shù)量的空格字符。

const user = {
    name: "DevPoint",
    age: 35,
    address: {
        city: "Shenzhen",
    },
};

console.log(JSON.stringify(user, null, 4));

輸出打印的字符串格式如下：

{
    "name": "DevPoint",
    "age": 35,
    "address": {
        "city": "Shenzhen"
    }
}

第三個(gè)參數(shù)為 String

如果第三個(gè)參數(shù)是一個(gè)字符串，它將被用來代替上面顯示的空格字符。

const user = {
    name: "DevPoint",
    age: 35,
    address: {
        city: "Shenzhen",
    },
};

console.log(JSON.stringify(user, null, "|---"));

輸出打印的字符串格式如下：

{
|---"name": "DevPoint",
|---"age": 35,
|---"address": {
|---|---"city": "Shenzhen"
|---}
}

toJSON 方法

有一個(gè)名為 toJSON 的方法，它可以是任何對(duì)象的一部分作為其屬性。 JSON.stringify 返回此函數(shù)的結(jié)果并將其字符串化，而不是將整個(gè)對(duì)象轉(zhuǎn)換為字符串。

//Initialize a User object
const user = {
    name: "DevPoint",
    city: "Shenzhen",
    toJSON() {
        return `姓名：${this.name}，所在城市：${this.city}`;
    },
};

console.log(JSON.stringify(user)); // "姓名：DevPoint，所在城市：Shenzhen"

總結(jié)

到此這篇關(guān)于JS JSON.stringify()使用場(chǎng)景詳解的文章就介紹到這了,更多相關(guān)JSON.stringify()使用場(chǎng)景內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！

最新評(píng)論