【JSON.stringify】JavaScriptオブジェクトをJSON文字列へ変換する強力なメソッド

By /

JSON.stringify() は、JavaScript オブジェクトを JSON 文字列に変換するための非常に便利なメソッドです。 本記事ではWeb 開発で広く使われているこの関数について基本的な使い方を紹介します。

JSON.stringify() の基本的な使い方

JSON.stringify() メソッドは、変換したい JavaScript のオブジェクトを引数として受け取ります。例えば、次の例のように辞書型のデータを簡単にJSON文字列に変換することができます。

const object = {name: "Alice", age: 25};
const jsonString = JSON.stringify(object);
console.log(jsonString); // 出力: '{"name":"Alice","age":25}'

この例では、JavaScript のオブジェクトを JSON 形式の文字列に変換しています。結果は、プロパティ名がダブルクォーテーションで囲まれた正規の JSON 文字列です。

オプションのパラメータ

JSON.stringify() は、オプションで追加の二つのパラメータを取ることができます：

  1. リプレーサー (replacer) – これは関数または値の配列であり、オブジェクトのどのプロパティを含めるかをコントロールできます。
  2. スペース (space) – これは出力フォーマットを整形し、見やすくするために使用される文字列または数字です。

リプレーサーの使用例

JSON.stringify() メソッドが提供するリプレーサー（replacer）機能は、オブジェクトのプロパティをどのように処理するかを細かくコントロールするためのものです。リプレーサーは関数（あるいは配列）の形として、オプションの第二引数として JSON.stringify() に渡すことができます。

リプレーサーが関数の場合、二つの引数を取ることができます。

  • key: 処理中のプロパティのキー。
  • value: そのプロパティの値。

この関数の戻り値は、JSON文字列に含める値を決定します。特定の値を除外したい場合は undefined を返し、その他の場合は新しい値を返します（プロパティを変更して返すことも可能です）。

const person = {
    name: "Alice",
    age: 25,
    job: "Engineer"
};

const replacerFunction = (key, value) => {
    if (key === "age") {
        return undefined; // "age" プロパティを無視
    }
    return value;
};

const jsonString = JSON.stringify(person, replacerFunction);
console.log(jsonString); // 出力: '{"name":"Alice","job":"Engineer"}'

スペースパラメータの使用例

スペースパラメータを使用して、出力される JSON 文字列の整形を行うことができます：

const jsonString = JSON.stringify(person, null, 4);
console.log(jsonString);
// 出力:
// {
//     "name": "Alice",
//     "age": 25,
//     "job": "Engineer"
// }

この例では、4 は各レベルのインデントに 4 スペースを使用することを意味します。

例外と特殊ケース

  • undefined, 関数, シンボルは JSON で有効な値ではないため、JSON.stringify() では無視されます。
  • 循環参照を含むオブジェクトは、JSON.stringify() でエラーを引き起こします。
const object = {};
object.myself = object;
JSON.stringify(object); // TypeError: Converting circular structure to JSON

このように、JSON.stringify() はオブジェクトを JSON 形式の文字列に変換する強力なツールですが、使用する際には特定のデータ型や構造に注意する必要があります。これにより、データのシリアライゼーションと通信が容易になります。

上部へスクロール