ツール
入力
結果
結果はここに表示されます。API レスポンスに手作業で型を付けるのは時間がかかり、しかもミスが入り込みやすい作業です。ときどき欠けるフィールド、ときどき null になる値、すべてのオブジェクトが同じキーを持つとは限らない配列などがその典型です。このツールは JSON を quicktype に渡します。quicktype は Glide がオープンソース化した型生成ツールで、エディター拡張機能 Paste JSON as Code のエンジンでもあります。結果は、そのままプロジェクトに貼り付けられるインターフェースとして返ってきます。JSON が配列の場合はすべての要素を比較するため、一部の要素にしかないキーは省略可能として、ときどき null になる値は null とのユニオン型として出力されます。
動作のしくみ
- quicktype-core はページ内で動作します。ライブラリは約 1 MB あるため、このツールで初めて「実行」を押したときにだけダウンロードされます。
- ネストされたオブジェクトはそれぞれ名前付きのインターフェースになり、別々の場所に現れる同一の形は 1 つの型にまとめられます。
- 日付に見える文字列も string 型のままにします。JSON.parse が実際に返すのは文字列だからです。
- interface 宣言か型エイリアス宣言かを選べるほか、全フィールドへの readonly 付与や、トップレベルの型名の指定もできます。
データの行き先
どこにも行きません。このツールは完全にブラウザ内で動作します。貼り付けたテキストはページが処理し、サーバーに送信されることも、ログに記録されることもありません。
このツールは無料で登録不要です。結果は開いているページの中にだけあり、どこにも保存されません。
必要なポイント
このツールは無料です。ログインもポイントも必要ありません。
よくある質問
- フィールドが省略可能かどうかは、どうやって判定していますか？
- 与えられたデータだけで判定します。JSON がオブジェクトの配列で、少なくとも 1 つの要素にあるキーが欠けていれば、そのキーには疑問符が付きます。単一のオブジェクトにはどちらとも判断する材料がないため、すべてのキーが必須になります。省略可能なキーを正しく判定させたい場合は、実際のレスポンスを複数まとめて 1 つの配列として貼り付けてください。
- string | null ではなく null 型になるフィールドがあるのはなぜですか？
- サンプルの値がすべて null だったため、quicktype にはほかに手がかりがなかったからです。値が入っているときに何が入るのかを知る方法がありません。GitHub のサンプルにある mirror_url がその例です。そのフィールドに値が入っている例を追加するか、手作業で型を広げてください。
- interface と型エイリアス、どちらを選ぶべきですか？
- 単純なオブジェクトの形であれば、実用上はどちらでも同じです。インターフェースは拡張でき、再宣言によるマージもでき、これに依存するライブラリもあります。型エイリアスはユニオン型やマップ型も表現できます。多くのコードベースはどちらかに統一しているので、それに合わせられるようにオプションを用意しています。
- 実行時にレスポンスを検証してくれますか？
- いいえ。TypeScript の型はコンパイル時に消えるため、形が合わないレスポンスもそのまま通ってしまいます。実行時のチェックが必要なら、このサイトの JSON → Zod ツールで同じ JSON から Zod スキーマを生成し、それでレスポンスをパースしてください。
背後にあるオープンソース
このツールは glideapps/quicktype（Apache-2.0）の上で動作しています。同じ処理を自分のプログラムに組み込みたい場合は、そのライブラリを使ってください。
glideapps/quicktype別の呼び方
- json typescript 変換
- json ts interface 生成
- json から 型 生成
- typescript 型定義 自動生成
- quicktype オンライン
- api レスポンス typescript 型