JSON → TypeScript 型定義生成
JSON を貼り付けると、対応する TypeScript の interface / type 定義を生成します。ネストしたオブジェクトは別 interface に分割、配列はキーをマージして一部だけに存在するキーを optional (?) に、混在する値は union 型に変換。ルート型名・interface / type 切替・export 付与を選べます。同じ構造の型は 1 つにまとめます。JSON はブラウザ内でだけ処理され、外部に送信されません。
使い方
API レスポンスや設定ファイルなどの JSON を入力欄に貼り付け、「型を生成」を押すと、対応する TypeScript の型定義が出力されます。ネストしたオブジェクトは別の interface に切り出し、配列はすべての要素のキーをマージして型を推論します。一部の要素にしか存在しないキーは optional (?) に、値の型が混在する場合は union 型 (例: string | number) になります。「ルート型名」で最上位の型名、「宣言」で interface か type かを選べ、「export を付ける」で各宣言に export を付与できます。生成はすべてブラウザ内で完結し、JSON はどこにも送信されません。
よくある質問
- 入力した JSON はサーバーに送信されますか?
- いいえ。JSON のパースと型生成は JavaScript でブラウザ内のみで実行され、入力はどこにもアップロードされません。
- 配列の型はどう推論されますか?
- 配列内のすべての要素を調べ、オブジェクトの場合はキーを 1 つの型にまとめます。全要素に存在するキーは必須、一部にしかないキーは optional (?) になります。要素の値の型が複数あるときは union 型 (例: (string | number)[]) として表現します。空の配列は unknown[] になります。
- null のキーはどう扱われますか?
- 値が null のキーは型 null として出力されます (例: deletedAt: null)。実際には日付などが入りうる場合は、生成後に string | null のように手で調整してください。JSON だけからは「null かもしれない別の型」を推論できないためです。
- 同じ構造の型がまとめられるのはなぜですか?
- 出力を読みやすくするため、フィールド構成がまったく同じ型は 1 つの interface / type に統合し、複数箇所から参照します。そのため、指定したルート型名以外の型数は JSON の構造によって変わります。
- interface と type のどちらを選べばいいですか?
- オブジェクトの形を表すだけならどちらでも同等です。宣言のマージ (declaration merging) を使いたい、あるいはチームの規約が interface ならば interface を、union やユーティリティ型と組み合わせたい場合は type を選ぶとよいでしょう。ルートが配列やプリミティブのときは interface では表現できないため、常に type エイリアスで出力されます。
類似のツール
JSON 整形・検証 — インデント / 圧縮 / エラー表示
JSON をブラウザ内で整形 (インデント指定) ・最小化・バリデーションします。エラー行・列を表示。データは一切外部に送信されません。
JSON 比較 / 差分 — 構造的に違いを抽出
2 つの JSON を構造的に比較。オブジェクト/配列のネストを再帰的に解析し、追加・削除・変更・移動の各差分をハイライト表示します。すべてブラウザ内で処理。
XML ↔ JSON 変換
XML と JSON を相互変換します。属性は `@_` プレフィックスで保持、整形 (2/4/タブ) を選択可。fast-xml-parser (MIT) でブラウザ内のみ実行、データはサーバーに送信されません。
CSV ⇄ JSON 変換 — 区切り / ヘッダ自動判定
CSV と JSON を相互変換します。区切り文字 (カンマ / タブ / セミコロン) ・ヘッダー行有無・JSON インデントを切り替え可能。クォート/改行入りフィールドにも対応し、すべてブラウザ内で処理されます。