APIのレスポンスや設定ファイルを扱う際、JSONが一行にまとまっていて読めない……というのはよくある悩みです。このガイドでは、JSONを人間が読みやすい形に整形し、エラーを検出・修正する方法を解説します。
JSONとは何か
JSON（JavaScript Object Notation）は、データを人間が読みやすいテキスト形式で表現するためのフォーマットです。WebAPIのレスポンス、設定ファイル、データベースのエクスポートなど、あらゆる場面で使われています。
整形前と整形後の比較
// 整形前（1行で読みにくい）
{{"name":"田中太郎","age":30,"skills":["JavaScript","Python"],"address":{{"city":"東京","zip":"100-0001"}}}}
// 整形後（インデント付きで読みやすい）
{{
"name": "田中太郎",
"age": 30,
"skills": [
"JavaScript",
"Python"
],
"address": {{
"city": "東京",
"zip": "100-0001"
}}
}}よくあるJSONエラーと修正方法
| エラー | 原因と修正 |
|---|---|
| 末尾のカンマ | {{"a":1,}} → {{"a":1}}（最後の要素後のカンマを削除） |
| シングルクォート | {{'name':'太郎'}} → {{"name":"太郎"}}（ダブルクォートに変更） |
| キーが文字列でない | {{name:"太郎"}} → {{"name":"太郎"}}（キーをクォートで囲む） |
| コメントがある | JSONはコメント非対応。// ...や/* ... */を削除する |
| undefined / NaN | JSONでは無効。nullまたは文字列に変換する |
JSONの圧縮（ミニファイ）が必要な場面
整形はデバッグ時に使い、本番環境ではJSONを圧縮（1行化）するのがベストプラクティスです。APIレスポンスのデータ量を減らし、通信コストを削減できます。QuickToolsのJSONフォーマッターにはMinify機能も搭載しています。
よくある質問
JSONとJavaScriptオブジェクトの違いは何ですか？
JSONはキーを必ずダブルクォートで囲む必要があり、関数・undefinedなどは使えません。JavaScriptオブジェクトはより柔軟です。JSONはデータ交換フォーマット、JSオブジェクトはプログラム内部で使うものと考えてください。
大きなJSONファイルも処理できますか？
はい。ブラウザ内処理なのでサーバーへの転送は不要です。数MB程度であれば問題なく処理できます。
JSON5やJSONCとの違いは？
JSON5はコメント・末尾カンマ・シングルクォートなどを許容する拡張仕様です。JSONCはコメントを許容します。ただしどちらも標準APIでは使えないため、ライブラリが必要です。
JSONをCSVに変換できますか？
はい。JSON to CSV変換ツールを使えば、JSONの配列データをExcelで開けるCSV形式に変換できます。