JSON整形・検証の完全ガイド：基礎からデバッグ実践まで

JSONとは？なぜ整形が重要か

JSON（JavaScript Object Notation）は現代のデータ交換の標準で、あらゆる場面で使われます。

APIレスポンス：多くのWeb APIがJSONを返す
設定ファイル：package.json、tsconfig.json など
データ保存：NoSQL、ローカルストレージ
メッセージング：マイクロサービス間通信

しかし生のJSONは1行に圧縮されており、読みにくいことが多いです。

{"name":"田中","age":28,"address":{"city":"東京","district":"渋谷"},"skills":["JavaScript","TypeScript","React"],"projects":[{"name":"ToolsKu","url":"https://www.toolsku.com"}]}

整形すると見やすくなります。

{
  "name": "田中",
  "age": 28,
  "address": {
    "city": "東京",
    "district": "渋谷"
  },
  "skills": [
    "JavaScript",
    "TypeScript",
    "React"
  ],
  "projects": [
    {
      "name": "ToolsKu",
      "url": "https://www.toolsku.com"
    }
  ]
}

ToolsKuでJSONを整形する

基本操作

JSON整形ツールを開く
JSONテキストを貼り付けまたは入力
自動整形して結果を表示
構文エラーがある場合は位置と理由を表示

高度な機能

インデント：2スペース、4スペース、タブ
キー並べ替え：アルファベット順で比較しやすく
圧縮/整形の切り替え：ワンクリック
シンタックスハイライト：型ごとに色分け

よくあるJSONエラーと対処

エラー1：末尾カンマ（Trailing Comma）

{
  "name": "田中",
  "age": 28,    ← 余分なカンマ
}

修正：最後のプロパティの後のカンマを削除。標準JSONでは末尾カンマは不可。

エラー2：シングルクォート

{
  'name': '田中'    ← JSONはダブルクォート必須
}

修正：すべての文字列を " で囲む。

エラー3：コメント

{
  // コメント    ← 標準JSONはコメント非対応
  "name": "田中"
}

修正：コメントを削除するか、JSONC（VS Code対応）を使う。ToolsKuの整形ツールはコメントを無視できます。

エラー4：エスケープされていない特殊文字

{
  "text": "1行目
2行目"        ← 改行は \n にエスケープ
}

修正：改行は \n、タブは \t、バックスラッシュは \\。

エラー5：クォートのないキー

{
  name: "田中"    ← キーもダブルクォート必須
}

修正："name": "田中" のようにキーをクォート。

JSONと他形式の変換

JSON ↔ YAML

YAMLは人が書きやすく、JSONは機械が扱いやすい：

# YAML
name: 田中
age: 28
skills:
  - JavaScript
  - TypeScript

JSON↔YAML で一括変換。

JSON ↔ TOML

Rustエコシステムでよく使われるTOML：

name = "田中"
age = 28
skills = ["JavaScript", "TypeScript"]

JSON↔TOML で変換。

JSON ↔ CSV

APIのJSONを表形式に：

JSON↔CSV を利用。

JSONの高度な操作

JSONPathクエリ

複雑なJSONから特定データを抽出：

JSON: { "users": [{"name": "田中", "age": 28}, {"name": "佐藤", "age": 32}] }
JSONPath: $.users[?(@.age > 30)].name
結果: ["佐藤"]

JSONPath で実行。

JSON Diff

2つのJSONの差分を可視化。APIのリクエスト/レスポンス比較、設定変更の確認などに便利。

JSON比較を使用。

型定義の自動生成

JSONからTypeScript/Go/Java/SQLの型を生成：

{ "name": "田中", "age": 28 }

TypeScript例：

interface Root {
  name: string;
  age: number;
}

JSON→TypeScript、JSON→Go など。

よくある質問

巨大なJSONは整形できる？

ToolsKuはブラウザ内で動作するため、サーバー制限がありません。数十MBのJSONも処理可能です。

特定の構造かどうか検証するには？

まず整形して構文を確認し、JSONPathで必須フィールドの有無を検証します。

JSONとJSON5の違いは？

JSON5はコメント、末尾カンマ、シングルクォートなどを許容するJSONのスーパーセットです。ToolsKuはJSON5構文にも対応しています。

まとめ

JSON処理は開発者の日常スキルです。ToolsKuでは整形、YAML、TOML、CSV、JSONPath、Diff、型生成をブラウザ内で無料・安全に利用できます。