JSON から JavaScript を生成

JSON を JavaScript に変換する方法 – 手順ガイド

この JSON→JavaScript 生成ツールを使って、Node.js やフロントエンド向けに JSON サンプルから JSDoc 型や実行時に使いやすいモデルを作成します。

1. ステップ 1 – JSON サンプルを貼り付ける

   • 左側のエディターに代表的な JSON オブジェクトまたは配列を貼り付けます。
   • ネストしたオブジェクト、配列、null になり得るフィールドを含めて、型推論を正確にします。
   • Import を使ってファイル、URL、サンプルデータから JSON を読み込みます。

2. ステップ 2 – JavaScript の出力オプションを選ぶ

   • プレーンオブジェクト、JSDoc typedef、クラス風ヘルパーのどれを出力するか決めます。
   • オプションフィールドの表現を確認し、分かりやすくドキュメント化します。
   • コードベースの命名（camelCase vs snake_case）と揃えます。

3. ステップ 3 – 生成されたコードを確認する

   • フィールド名、型、配列/オブジェクトの表現を確認します。
   • 利用可能なら Root Type Name、null の扱い、フレームワーク等のオプションを調整します。
   • 推論が違う場合は JSON サンプルを調整して再生成します。

4. ステップ 4 – JS プロジェクトで出力を使う

   • 出力をプロジェクトにコピーし、JSON をパースする箇所に組み込みます。
   • 動的型付けに依存する場合は実行時に入力を検証します。
   • 契約を強制したい場合は JSON Schema の生成も検討します。

5. ステップ 5 – コピーまたはダウンロード

   • 出力をプロジェクトにコピーするか、ファイルとしてダウンロードします。
   • フォーマッター/リンターを実行してコードスタイルを整えます。
   • 必要に応じて JSON の解析/シリアライズ用ライブラリを追加します。

// JSON 入力
{
  "id": 123,
  "name": "Maeve Winters",
  "email": "[email protected]",
  "active": true,
  "roles": ["admin", "editor"],
  "metadata": { "plan": "pro" },
  "createdAt": "2024-03-01T10:15:00Z",
  "score": 99.5,
  "notes": null
}

// Generated JSDoc types (simplified)
/**
 * @typedef {Object} Metadata
 * @property {string} plan
 */

/**
 * @typedef {Object} Root
 * @property {number} id
 * @property {string} name
 * @property {string|null} email
 * @property {boolean} active
 * @property {string[]} roles
 * @property {Metadata} metadata
 * @property {string} createdAt
 * @property {number} score
 * @property {null} notes
 */

関連する JSON & JavaScript ツール

この JSON→JavaScript 生成ツールと相性の良い JSON/スキーマ関連ツールもチェックしてください。