JavaScriptでオブジェクトをJSON文字列に変換する際によく使用される`JSON.stringify()`メソッドについて、詳しく解説します。

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

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

構文

JSON.stringify(value[, replacer[, space]])
  • value: 変換対象のJavaScriptオブジェクト
  • replacer: 変換処理をカスタマイズする関数または配列（省略可能）
  • space: 出力される文字列の整形に使用するスペース（省略可能）

よくあるユースケース

1. シンプルなオブジェクトの変換

const user = {
  name: "Alice",
  email: "alice@example.com"
};
console.log(JSON.stringify(user));

2. ネストされたオブジェクトの変換

const data = {
  user: {
    name: "Bob",
    age: 25
  },
  settings: {
    theme: "dark"
  }
};
console.log(JSON.stringify(data));

3. 整形して出力

const obj = { a: 1, b: 2 };
console.log(JSON.stringify(obj, null, 2));
/*
{
  "a": 1,
  "b": 2
}
*/

注意点と制限事項

1. 関数は変換されない

const obj = {
  func: function() { return 1; }
};
console.log(JSON.stringify(obj)); // {}

2. undefined値は省略される

const obj = {
  a: undefined,
  b: null
};
console.log(JSON.stringify(obj)); // {"b":null}

3. 循環参照は例外を発生させる

const obj = {};
obj.self = obj;
// TypeError: Converting circular structure to JSON

エラー処理

try {
  const jsonString = JSON.stringify(someObject);
} catch (error) {
  console.error('JSON変換エラー:', error);
}

実践的な使用例

ローカルストレージへの保存

const userData = {
  name: "Charlie",
  preferences: {
    darkMode: true
  }
};
localStorage.setItem('userData', JSON.stringify(userData));

APIリクエストの送信

const postData = {
  title: "新しい投稿",
  content: "Hello, World!"
};

fetch('/api/posts', {
  method: 'POST',
  headers: {
    'Content-Type': 'application/json'
  },
  body: JSON.stringify(postData)
});

パフォーマンスの考慮事項

  • 大きなオブジェクトを変換する場合は、パフォーマンスに影響する可能性があります
  • 必要な場合のみ変換を行い、不要な変換は避けましょう

まとめ

`JSON.stringify()`は、JavaScriptオブジェクトをJSON文字列に変換する強力なメソッドです。APIとの通信やデータの永続化など、様々な場面で活用できます。ただし、関数や undefined の扱い、循環参照には注意が必要です。