jaen

JSON整形・TypeScript型変換

入力したJSONを2スペース・4スペース・1行化（Minify）で整形したり、TypeScriptのinterface定義コードに変換したりできるツールです。リアルタイムに構文チェックを行い、すべての処理はブラウザ内で完結します。

データをサーバーに送信せずブラウザ内で安全に処理しています。

使い方

  1. 左側の入力欄に整形・変換したいJSONを貼り付けます。
  2. 「整形 (Format)」タブでは2スペース・4スペース・1行化 (Minify) のいずれかを選び、読みやすい形式に整形します。
  3. 「TypeScript型生成」タブに切り替えると、入力したJSONの構造からTypeScriptのinterface定義コードが自動生成されます。
  4. 構文エラーがある場合は該当する行・列番号とエラー内容が表示されるので、修正後に再度確認できます。

このツールについて

JSON整形・TypeScript型変換ツールは、崩れたJSONを読みやすく整形したり、JSONの構造からTypeScriptの型定義コードを自動生成したりできるツールです。APIレスポンスの確認や、外部から取得したJSONデータに対応する型定義を素早く作成したい場合に活用できます。

構文チェックには独自の簡易JSONパーサーを使用しており、JavaScriptエンジンごとに異なる`JSON.parse`のエラーメッセージ形式に依存せず、常に正確な行・列番号でエラー箇所を特定します。

TypeScript型生成では、配列内に含まれる構造が同じオブジェクトを1つのinterfaceにまとめ、要素によって存在したりしなかったりするフィールドは自動的にオプショナル（`?`）として出力します。

よくある質問

生成されたTypeScriptの型はそのまま使えますか？

生成された`interface`定義はコピーしてそのままプロジェクトに貼り付けて利用できます。ただし、フィールド名や型の意味づけ（IDなど）は自動判定のため、必要に応じて命名や型を調整してください。

巨大なJSONでも整形できますか？

ブラウザのメモリが許す範囲であれば整形可能です。非常に大きなJSONの場合、ブラウザの動作が一時的に重くなることがあります。

配列のトップレベルのJSONにも対応していますか？

対応しています。配列がトップレベルの場合は、型生成時に配列の要素の型を表す`type`エイリアスが生成されます。

入力したJSONはサーバーに送信されますか？

送信されません。構文チェック・整形・型生成のすべての処理はブラウザ内のJavaScriptで実行されます。