JSONをオンラインで整形(Pretty-Print)

JSONを適切なインデントと改行で整形・美化します。圧縮されたJSONを人間が読みやすい形式に変換し、デバッグや編集を効率化する無料オンラインツールです。

Format

詳細な説明

JSONの整形(Pretty-Print)とは、コンパクトまたは圧縮されたJSON文字列に、一貫したインデント、改行、スペースを付けてフォーマットし、階層構造を視覚的に明確にすることです。デバッグ、コードレビュー、そして人間がJSONデータを読み書きするあらゆる場面で不可欠です。

整形が重要な理由:

{"users":[{"name":"Alice","roles":["admin","editor"]},{"name":"Bob","roles":["viewer"]}]} のような圧縮されたJSONは、視覚的にスキャンすることがほぼ不可能です。整形するとネスト構造が一目でわかるようになり、欠落した値、不正なネスト、予期しないデータ型を簡単に発見できます。ほとんどの開発者はJSONを書くよりも読む時間のほうがはるかに長いため、フォーマットは直接的に生産性に影響します。

JavaScriptでの整形方法:

組み込みの JSON.stringify() メソッドは、第3引数にインデントを受け取ります:

const formatted = JSON.stringify(data, null, 2); // 2スペースインデント
const formatted4 = JSON.stringify(data, null, 4); // 4スペースインデント
const tabbed = JSON.stringify(data, null, "\t"); // タブインデント

第2引数はreplacer関数または配列で、シリアライズ時に値をフィルタリングまたは変換できます。null を渡すと変換なしになります。

インデントの慣例:

最も一般的な2つの慣例は、2スペースと4スペースのインデントです。2スペースはよりコンパクトで、フロントエンドJavaScriptエコシステム(一般的なESLintやPrettierのデフォルトに一致)で好まれます。4スペースはより大きな視覚的分離を提供し、PythonやJavaエコシステムで一般的です。タブインデントはJSONではあまり使われませんがサポートされています。公式の標準はありません。JSON仕様(RFC 8259)はフォーマットを規定していません。

開発者がよくやるミス:

よくある間違いは、有効なJSONでない文字列を整形しようとすることで、パーサーが例外をスローします。フォーマットの前に必ずバリデーションを行ってください。もうひとつのミスは二重エンコーディングです。すでにJSONテキストである文字列に JSON.stringify() を呼び出すと、整形された出力ではなくエスケープされた文字列になります。まず JSON.parse() でパースし、次にインデント付きで再stringify する必要があります。また、バージョン管理にコミットする際、圧縮版がより適切な場面で大きな整形済みJSONファイルをコミットしてしまうこともあります。

ベストプラクティス:

開発環境、ログビューア、デバッグツールで整形を使用してください。エディタやIDEで保存時にJSONファイルを自動フォーマットするよう設定しましょう。バージョン管理するJSONについては、チーム内で一貫したインデントスタイルを合意し、差分のノイズを最小限に抑えましょう。

ユースケース

デバッグ中に圧縮されたAPIレスポンスを整形し、フロントエンドのレンダリングエラーを引き起こしているネストされたフィールドの欠落を素早く特定する。

試してみる — JSON Formatter

フルツールを開く