JSONからTypeScriptへの変換ツール
JSONのサンプルをTypeScriptのインターフェースまたは型エイリアスに変換します。プリミティブ型・配列・入れ子のオブジェクト型を推定し、オブジェクトの配列を任意キー付きの1つのインターフェースに統合します。ルート型の名前も指定できます。
入力
最上位のインターフェース/型の名前です。PascalCaseに変換されます。
JSONのnullをどう型付けするか。空の配列は常にunknown[]になります。
出力
ガイド
JSONのサンプルを貼り付けるだけで、その形を表すTypeScriptのインターフェースまたは型エイリアスを生成します。コンバーターがJSONを読み取り、すべての値の型を推論し、入れ子構造に名前を付けてくれます。手作業の型付けも推測も不要です。APIレスポンスや設定ファイル、フィクスチャを型付きコードに変換する最速の方法です。
できること
ツールはJSONを読み取り、対応するTypeScriptの型定義を生成します。
- プリミティブは
string、number、booleanにマッピングされます。 - 入れ子のオブジェクトは、親から参照される名前付きの
interfaceになります(例:address: Address)。 - プリミティブの配列は
T[]になります。異種混在の配列は(number | string)[]のようなユニオン型になります。 - オブジェクトの配列は、全要素に現れるすべてのキーを統合した単一のinterfaceにまとめられます。少なくとも1つの要素に欠けているキーは
key?:でオプションになります。 nullの値は、出力を壊さずにnull(またはお好みでundefined)に広げられます。- 空の配列は推論できないため
unknown[]になります。
使い方
- 入力欄にJSONを貼り付けるか入力します。
- ルート型の名前を設定します。最上位のinterfaceの名前になります(デフォルト
Root、PascalCaseに変換)。 - 出力スタイルを選びます:
interfaceまたはtypeエイリアス。 - null値の扱いを選びます(
nullまたはundefined)。 - 生成されたTypeScriptをコピーするか、
interfaces.tsとしてダウンロードします。
編集するたびに出力が自動更新されるので、JSONを調整しながら型の変化をリアルタイムで確認できます。
interface と type、どちらを選ぶべき?
インターフェースはオブジェクトの形の定番で、宣言のマージに対応しています。型エイリアスは、ユニオンやユーティリティ型と組み合わせて形を構成・エクスポートしたいときに便利です。生成されるメンバーは同じなので、コードベースに合う方を選んでください。いつでも切り替えられます。
オブジェクトの配列はどう処理されますか?
配列内のすべてのオブジェクトが走査され、キーが1つのinterfaceに統合されます。一部の要素にしかないキーはオプション(key?:)になります。これは、レコードが完全に均一ではない実際のAPI配列で一般的に望ましい動作です。
混在・空の配列はどうなりますか?
[1, "two"] のような混在配列は、(number | string)[] というユニオン要素型になります。空の配列は調べる要素がないため、unknown[] になります。安全かつ明示的で、後で絞り込みやすい型です。
深く入れ子になったJSONに対応していますか?
はい。入れ子の各オブジェクトはキーに基づいた名前の独自interfaceを持ち、それらのinterfaceはルート型と一緒に出力されるため、構造全体が完全に型付けされます。
プライバシー
このコンバーターは完全にブラウザ内で動作します。JSONはお使いの端末上で解析・変換され、サーバーにアップロードされたり、記録されたり、保存されたりすることはありません。機密性の高いペイロードにも使え、ページを読み込んだ後はオフラインでも作業できます。
Use it from code
From 3 credits per callREST API
curl -X POST https://api.iotools.cloud/v1/tool/json-to-typescript-converter \
-H "Authorization: Bearer YOUR_API_KEY" \
-H "Content-Type: application/json" \
-d '{
"jsonInput": "{\"id\":1,\"tags\":[\"admin\",\"user\"],\"scores\":[95,87]…",
"rootName": "Root",
"exportStyle": "interface",
"nullType": "null"
}'Swap in your own key from your account. The tool's fields are the body — no wrapper.
Ask an AI agent
Use the IOTools `json-to-typescript-converter` tool (JSON to TypeScript Converter) on this input:
YOUR_INPUT_HEREPaste this at any agent connected to the IOTools MCP server, then add your input.