JSONとは何か｜データ形式の基本・整形方法・よくあるエラーを解説

JSON（JavaScript Object Notation） は、データをテキストで表現するための軽量なフォーマットです。APIのレスポンス、設定ファイル、ログデータなど、あらゆる場所で使われており、Webに関わる仕事をする上でほぼ必ず目にします。

JSONの基本構造

JSONは2種類のデータ構造で構成されています。

オブジェクト（{}）

キーと値のペアを {} で囲みます。

{
  "name": "田中太郎",
  "age": 30,
  "email": "tanaka@example.com"
}

複数の値を順番に並べたリストです。

["東京", "大阪", "福岡"]

{
  "company": "例株式会社",
  "members": [
    { "name": "田中", "role": "営業" },
    { "name": "鈴木", "role": "開発" }
  ]
}

JSONで使える値の型は6種類です。

よくあるエラーと原因

シングルクォートを使っている

// ❌ エラー
{ 'name': '田中' }

// ✅ 正しい
{ "name": "田中" }

末尾のカンマ（トレイリングカンマ）

// ❌ エラー
{
  "name": "田中",
  "age": 30,   ← 最後の要素にカンマ
}

// ✅ 正しい
{
  "name": "田中",
  "age": 30
}

// ❌ エラー（JSONはコメントを許容しない）
{
  // ユーザー情報
  "name": "田中"
}

キーがクォートされていない

// ❌ エラー
{ name: "田中" }

// ✅ 正しい
{ "name": "田中" }

JSONの整形と圧縮

受け取ったJSONが1行にまとまっていて読みにくい場合は整形（Pretty Print）、逆にスペースや改行を取り除いてデータを小さくしたい場合は圧縮（Minify）を行います。

// 圧縮（Minified）
{"name":"田中","age":30,"city":"東京"}

// 整形（Pretty Print）
{
  "name": "田中",
  "age": 30,
  "city": "東京"
}

APIレスポンスでの読み方

REST APIはほとんどの場合、JSONでデータを返します。

{
  "status": "success",
  "data": {
    "id": 1001,
    "title": "記事タイトル",
    "published_at": "2026-06-08T09:00:00Z",
    "tags": ["SEO", "Web制作"]
  },
  "meta": {
    "total": 150,
    "page": 1
  }
}

JSONとXMLの比較

以前はXMLがデータ交換の主流でしたが、現在はJSONが主に使われています。

Google Analytics 4やFacebook広告のAPIなど、マーケティングツールのAPIもほぼすべてJSONで通信しています。