JavaScript/JSON

JSON オブジェクトは、JavaScript Object Notation (JSON) フォーマットでデータをエンコード/デコードするための機能を提供します。このオブジェクトは、JavaScript 値を JSON 文字列に変換したり、JSON 文字列を JavaScript 値に変換したりするメソッドを提供します。

プロパティ

JSON オブジェクトは、以下のメソッドを持っています：

• JSON.parse(): JSON 文字列を JavaScript 値に変換します。
• JSON.stringify(): JavaScript 値を JSON 文字列に変換します。

メソッド

JSON.parse()

JSON.parse(text[, reviver])

• text: 解析する JSON 文字列。
• reviver (オプション): 変換結果のキーと値のペアに対して変換処理を行う関数。

JSON.stringify()

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

• value: JSON 文字列に変換する値。
• replacer (オプション): 値の変換方法をカスタマイズするための関数または配列。
• space (オプション): 読みやすさを向上させるための空白の挿入方法を指定します。

例

JSON.parse() の基本的な使用方法

以下のプログラムは、JSON.parse() を使用して JSON 文字列を JavaScript オブジェクトに変換する方法を示しています。

const jsonString = '{"name":"山田太郎","age":30,"isStudent":false,"hobbies":["読書","旅行","料理"]}';
const person = JSON.parse(jsonString);

console.log(person.name); // "山田太郎"
console.log(person.age); // 30
console.log(person.hobbies[1]); // "旅行"

このプログラムでは、JSON.parse() を使用して JSON 文字列を JavaScript オブジェクトに変換しています。変換後のオブジェクトのプロパティにアクセスできます。

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

以下のプログラムは、JSON.stringify() を使用して JavaScript オブジェクトを JSON 文字列に変換する方法を示しています。

const person = {
  name: "山田太郎",
  age: 30,
  isStudent: false,
  hobbies: ["読書", "旅行", "料理"],
  address: {
    city: "東京",
    postalCode: "123-4567"
  }
};

const jsonString = JSON.stringify(person);
console.log(jsonString);
// {"name":"山田太郎","age":30,"isStudent":false,"hobbies":["読書","旅行","料理"],"address":{"city":"東京","postalCode":"123-4567"}}

// 整形して出力
const formattedJson = JSON.stringify(person, null, 2);
console.log(formattedJson);
/*
{
  "name": "山田太郎",
  "age": 30,
  "isStudent": false,
  "hobbies": [
    "読書",
    "旅行",
    "料理"
  ],
  "address": {
    "city": "東京",
    "postalCode": "123-4567"
  }
}
*/

このプログラムでは、JSON.stringify() を使用して JavaScript オブジェクトを JSON 文字列に変換しています。また、第3引数に 2 を指定することで、読みやすく整形された JSON 文字列が生成されます。

reviver 関数と replacer 関数の使用例

以下のプログラムは、JSON.parse() の reviver 関数と JSON.stringify() の replacer 関数を使用する方法を示しています。

// 日付文字列を Date オブジェクトに変換する reviver 関数
const jsonWithDate = '{"name":"イベント1","date":"2023-05-15T09:00:00.000Z"}';
const eventObj = JSON.parse(jsonWithDate, (key, value) => {
  if (key === "date" && typeof value === "string") {
    return new Date(value);
  }
  return value;
});

console.log(eventObj.date.getFullYear()); // 2023
console.log(eventObj.date instanceof Date); // true

// Date オブジェクトをカスタム形式で変換する replacer 関数
const eventToSend = {
  name: "イベント2",
  date: new Date("2023-06-20T14:30:00.000Z"),
  location: "東京",
  private: true
};

const jsonString = JSON.stringify(eventToSend, (key, value) => {
  if (key === "private") {
    return undefined; // private プロパティを除外
  }
  if (value instanceof Date) {
    return value.toLocaleDateString(); // 日付を特定の形式に変換
  }
  return value;
});

console.log(jsonString);
// {"name":"イベント2","date":"2023/6/20","location":"東京"}

このプログラムでは、JSON.parse() の reviver 関数を使用して日付文字列を Date オブジェクトに変換し、JSON.stringify() の replacer 関数を使用して特定のプロパティを除外したり、Date オブジェクトをカスタム形式に変換したりしています。

注意点

• サポートされるデータ型: JSON は数値、文字列、ブール値、null、オブジェクト、配列のみをサポートします。undefined、関数、Symbol、循環参照は直接サポートされません。
• 安全性: JSON.parse() に信頼できないソースからの文字列を渡す前に検証を行うべきです。
• 日付の扱い: JSON は日付型をネイティブにサポートしていないため、Date オブジェクトは文字列として変換されます。
• BigInt: BigInt 値は JSON.stringify() でサポートされていないため、TypeError が発生します。

外部リンク

• ECMA-262::25.5 The JSON Object