m moji kit v1.0.9
変換 JSON → TypeScript

JSON から TypeScript の型を作る

JSON サンプルから TypeScript の interface / type を生成する方法です。API レスポンスの型定義に使えます。

解説

JSON サンプルから TypeScript の型定義を作る変換です。プリミティブ値は対応する TS 型に、配列は要素型の配列に、オブジェクトは無名 type または interface にします。 単一サンプル由来の制約があります。string か string | null かを判別できない、配列の要素型は最初の 1 件で決まるので union を取りこぼす、数値の min/max は型に表現できない、の 3 点です。本格的には OpenAPI スキーマからの型生成 (openapi-typescript) が確実です。

サンプル入力(JSON)

{
  "id": 42,
  "name": "alice",
  "isAdmin": false,
  "tags": ["editor", "admin"],
  "address": { "city": "Tokyo", "zip": "150-0001" }
}

サンプル出力(TypeScript)

interface User {
  id: number;
  name: string;
  isAdmin: boolean;
  tags: string[];
  address: {
    city: string;
    zip: string;
  };
}

使うときのコツ

  • · 複数サンプルを取って union 型で結合すると、欠損キーや null 可能性を取り込める
  • · API スキーマ(OpenAPI / GraphQL)があるならそちらから型生成(openapi-typescript / graphql-codegen)
  • · 数値が ID か量かの区別は型から不能。branded type(type UserId = number & { readonly brand: unique symbol })で誤用防止

よくある質問

interface と type のどちらで出すべき?
プロジェクトの慣習次第です。interface は宣言マージ可能、type は union やリテラル型に強い。チームで統一されていればどちらでも構いません。
オプショナル(?)はどう判定?
単一サンプルでは判定不可能なので、すべて必須として出力します。複数サンプル間で欠損があるキーをオプショナルにする方針が安全です。
ネストしたオブジェクトを別 interface に分けたい
address のような頻出ネストは別 interface に切り出すと再利用しやすくなります。本ツールではインラインで生成するので、生成後に手で切り出してください。
数値の Date は string になりますか?
JSON 上の "2025-01-01T00:00:00Z" はパース時には string です。Date 型に変換したい場合は zod や自前のパース関数を経由します。型レベルでは string のままが正確です。
API レスポンスの型生成にはどの方法が安全?
OpenAPI スキーマがあれば openapi-typescript、GraphQL なら graphql-codegen が確実です。サーバー実装と型がリンクするので、変更を見逃しにくくなります。
ライブラリで自動化したい
quicktype(quicktype.io)が広く使われています。CLI / Web / VS Code 拡張があり、Python・Go 等への変換も対応します。

関連ツール

{ }
JSON フォーマッタ
JSON を整形・圧縮・キーソートします。