JSON.stringify() に関する 5 つの使用シナリオを共有します。

JSON.stringify() メソッドは、JavaScript オブジェクトまたは値を JSON 文字列に変換します。 replacer 関数が指定されている場合はオプションで値を置き換え、 replacer 配列が指定されている場合はオプションで配列で指定されたプロパティのみを含めます。

構文は次のとおりです。

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

最初のパラメータ value: JSON 文字列にシリアル化される値。
2 番目のパラメータ replacer: オプションのパラメータ。パラメータが関数の場合、シリアル化された値の各属性はシリアル化プロセス中に関数によって変換および処理されます。パラメータが配列の場合は、この配列に含まれるプロパティ名のみが変換されます。最終的な JSON 文字列にシリアル化されます。このパラメータが指定されている場合 null でも指定されていない場合でも、オブジェクトのすべてのプロパティがシリアル化されます。
3 番目のパラメータ space: オプションのパラメータ。インデント用の空白文字列を指定し、出力 ( pretty-print) を美しくするために使用します。パラメータが数値の場合、スペースの数を表します。上限はです 10。値がより小さい場合 1、スペースがないことを意味します。パラメータが文字列の場合 (文字列の長さが 10 文字を超える場合は、最初の 10 文字を取得します)、文字列はスペースとして扱われます。が指定されていない (または null である) 場合、スペースは存在しません。

2番目のパラメータは`replacer` 配列です

はい、JSON.stringify() 関数には、コンソールに表示するオブジェクトのキーの配列である 2 番目のパラメーターを指定できます。例を見てみましょう:

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"}]

JSON オブジェクト全体を 2 番目のパラメーターに配列として渡すことで、印刷するキーのみを印刷できます。

2 番目のパラメータは`replacer` 関数です

2 番目の引数を関数として渡し、関数に記述されたロジックに従って各キーと値のペアを評価することもできます。undefined キーと値のペアが返された場合、それは出力されません。以下の例を参照してください。

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

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

上記のコードの出力は、JSON データの属性値をフィルターするために使用できます。

3 番目のパラメータは数値です。

3 番目のパラメータは、最終的な文字列の間隔を制御します。引数が数値の場合、文字列化の各レベルは、この数のスペース文字によってインデントされます。

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

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

出力 print の文字列形式は次のとおりです。

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

3番目のパラメータは文字列です

3 番目の引数が文字列の場合は、上記のスペース文字の代わりに使用されます。

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

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

出力 print の文字列形式は次のとおりです。

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

toJSON メソッド

と呼ばれるメソッドがあり toJSON 、これはプロパティとして任意のオブジェクトの一部にすることができます。JSON.stringify この関数の結果を返し、オブジェクト全体を文字列に変換するのではなく、それを文字列化します。

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

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

-EOF-

作者:不謹慎

https://juejin.cn/post/7191712569394987065