JSONからTypeScriptの型を作る
JSONの見本からTypeScriptのインターフェースを導きます。手で書き写すと必ず一つ二つ落とし、その誤りは動かすまで表に出てきません。配列の中のオブジェクトは形が違えばまとめられ、一部に無い項目には任意の印が付きます。
入れたものは端末から出ません。 ブラウザの中だけで処理し、どこにも送らず保存もしません。
見本一つから推測しています。たまたま null だった項目は null として出ますし、見本に無い任意の項目は拾えません。配列の中のオブジェクトはまとめられ、一部にしか無い項目には ? が付きます。信じる前に一度目を通してください。
名前はどう付くか
ルート名の欄に書いたものが最初のインターフェースになります。内側のオブジェクトはキーの名前をパスカル記法に直して使います — owner は Owner、shipping_address は ShippingAddress です。名前が重なるのに形が違えば Owner2 のように数字を付け、形が同じなら一つだけ作って共有します。ルートがオブジェクトではなく配列なら、RootList という別名がもう一つ出ます。
型を推測する規則
数値は整数でも小数でも number です。日付や URL はただの string です — JSON にそれらを区別する書き方がないからです。一つの場所に複数の型が来れば string | null のようにまとめます。空の配列は何が入るのか知りようがないので unknown[] にします。識別子として使えないキー(content-type・1st)は引用符で囲みます。
見本を複数まとめる方法
応答を一つだけ入れると、その応答にあった項目だけが拾われます。複数の応答を角括弧で囲んで配列として入れると、内側のオブジェクトがまとめられます — どれか一つにしかなかった項目には ? が付き、ある応答では null で別の応答では値だった項目は string | null になります。
よくある質問
出た型をそのまま使えますか
一度目を通してください。見本一つからの推測には限りがあります — たまたま null だった項目は null しか取れないように見えますし、見本に無かった任意の項目はそもそも出てきません。応答をいくつか並べて貼り付けると精度が上がります。
同じ形が何度も出てきたら
インターフェースを一つ作って共有します。同じ型が別の名前でいくつも溜まるのを防ぐためです。
`null` はどうなりますか
見本に null しか無ければ本当の型は分からないので、null のまま出ます。値の入った見本を足すか、手で直してください。
入れ子のオブジェクトは
入れ子のオブジェクトごとにインターフェースを作り、外側から参照します。配列の中のオブジェクトは一つの形にまとめられ、一部にしか無い項目には疑問符が付きます。
`type` で出すことはできませんか
できません。インターフェースだけを出します。項目の一覧だけの形なので type に書き換えても意味は同じです。チームの規約が type なら、単語だけ差し替えてください。
数値のキーを持つオブジェクト(マップ)は
そのキーをそのまま項目として使います。{"1": …, "2": …} は "1"・"2" という二つの項目になります。キーが値である辞書なら、Record<string, T> に手で直してください。
貼り付けたものはサーバへ送られますか
送られません。すべてブラウザの中で動き、送信も保存もしません。だからこそ、ふつうならウェブページに貼り付けない社内の設定ファイルや本番のクエリにも使えます。通信を切ったままでも動きます。