← 記事一覧

JSON を整形する方法: pretty-print、検証、整理

JavaScript の JSON.stringify、Python の json.dumps、コマンドラインの jq、またはブラウザで即座に JSON を整形。キーソート、YAML/CSV → JSON 変換、ビフォーアフター例を含む。

API やログから来る生の JSON はしばしば 1 行に詰まっています —— 妥当ですが、ぱっと見では読めません。JSON のフォーマット(「pretty-print」「美化」とも呼ばれる)は一貫したインデントと改行を加え、構造が一目で分かるようにします。本ガイドでは JavaScript、Python、コマンドライン、そしてブラウザで JSON ファイルや文字列をフォーマットする方法を示します。

「JSON のフォーマット」とは?

JSON フォーマッタは、コンパクトまたは不均一にインデントされた JSON 文字列を次のように書き直します:

  • 各キー・値ペアを 1 行に
  • ネストされたオブジェクトと配列を固定スペース数でインデント(通常 2 か 4)
  • 末尾の空白を残さない
// フォーマット前(minify 済み)
{"user":{"name":"Alice","age":30,"roles":["admin","editor"]}}

// フォーマット後(2 スペースインデント)
{
  "user": {
    "name": "Alice",
    "age": 30,
    "roles": [
      "admin",
      "editor"
    ]
  }
}

2 つの形式は意味的に同一です —— JSON パーサはいずれからも同じデータ構造を生成します。フォーマットは人が読むためだけのものです。

JavaScript で JSON をフォーマット

JSON.stringify() は第二引数(replacer)と第三引数(インデントレベル)を受け取ります。replacer に null2 で 2 スペースのインデントになります(完全な API は How to Stringify JSON):

const obj = { user: { name: "Alice", age: 30, roles: ["admin", "editor"] } };

// コンパクト(フォーマットなし)
JSON.stringify(obj);
// '{"user":{"name":"Alice","age":30,"roles":["admin","editor"]}}'

// 2 スペースインデントで美化
JSON.stringify(obj, null, 2);

// 4 スペースインデント
JSON.stringify(obj, null, 4);

// タブインデント
JSON.stringify(obj, null, '\t');

JSON 文字列(オブジェクトではなく)をフォーマット

すでに妥当だがフォーマットが乱れた JSON 文字列が手元にあるなら、先にパースしてから stringify を再実行します:

const raw = '{"name":"Alice","age":30}';
const formatted = JSON.stringify(JSON.parse(raw), null, 2);
console.log(formatted);

キーをアルファベット順にソート

フォーマット時にオブジェクトキーをソートするには、出会ったオブジェクトごとにキーをソートする replacer 関数を渡します:

function sortedStringify(obj, indent = 2) {
  return JSON.stringify(obj, (key, value) => {
    if (value && typeof value === 'object' && !Array.isArray(value)) {
      return Object.keys(value).sort().reduce((acc, k) => {
        acc[k] = value[k];
        return acc;
      }, {});
    }
    return value;
  }, indent);
}

Python で JSON をフォーマット

Python 組み込みの json モジュールは indent パラメータでフォーマットを扱います:

import json

# Python dict をフォーマット
data = {"user": {"name": "Alice", "age": 30, "roles": ["admin", "editor"]}}
formatted = json.dumps(data, indent=2)
print(formatted)

# JSON 文字列をフォーマット
raw = '{"name":"Alice","age":30}'
formatted = json.dumps(json.loads(raw), indent=2)

# キーをアルファベット順にソート
formatted = json.dumps(data, indent=2, sort_keys=True)

# JSON ファイルをフォーマット
with open('input.json') as f:
    data = json.load(f)
with open('output.json', 'w') as f:
    json.dump(data, f, indent=2)

コマンドラインで JSON ファイルをフォーマット

jq を使う(推奨)

jq はコマンドラインの事実上の JSON プロセッサです。デフォルトで JSON をフォーマットします:

# JSON ファイルを美化
jq . input.json

# 美化して別ファイルに保存
jq . input.json > output.json

# curl のレスポンスをフォーマット
curl -s https://api.example.com/users | jq .

# キーをソート
jq --sort-keys . input.json

Python を使う(インストール不要)

Python が入っているシステムなら、json.tool モジュールがコマンドラインのフォーマッタとして使えます:

# ファイルをフォーマット
python3 -m json.tool input.json

# 標準入力からフォーマット
echo '{"name":"Alice","age":30}' | python3 -m json.tool

# キーをソート
python3 -m json.tool --sort-keys input.json

Node.js を使う

node -e "const fs=require('fs'); const d=JSON.parse(fs.readFileSync('input.json')); console.log(JSON.stringify(d,null,2))"

データを JSON 形式に変換する方法

「format to JSON」はしばしば、別の形式(Python dict、CSV ファイル、YAML 設定など)のデータを妥当な JSON へシリアライズすることを指します。

YAML から JSON へ

# Python
import yaml, json
with open('config.yaml') as f:
    data = yaml.safe_load(f)
print(json.dumps(data, indent=2))

あるいはブラウザで YAML to JSON コンバータ を使ってください —— コード不要です。どちらを選ぶかは JSON vs YAML を、YAML 1.2 が JSON の正式な上位集合である背景は YAML 1.2 と JSON の互換性 を参照。

CSV から JSON へ

import csv, json
with open('data.csv') as f:
    rows = list(csv.DictReader(f))
print(json.dumps(rows, indent=2))

JavaScript オブジェクトから

JavaScript オブジェクトは JSON のように見えても JSON ではありません —— クォートなしのキー、シングルクォート文字列、末尾カンマ、コメントを持てます。不正な JavaScript オブジェクトリテラルを JSON Fix に貼ると、自動で妥当な JSON に変換します。

エディタで JSON をフォーマット(Prettier、VS Code、pre-commit)

日常の作業では、フォーマットに最も有用なタイミングは保存時です —— こうすれば未フォーマットの JSON が git や PR に到達することはありません。

Prettier

# install
npm i -D prettier

# すべての .json(とソース)をその場でフォーマット
npx prettier --write "**/*.{json,jsonc}"

# チェックのみ(CI 向け、フォーマットが必要なら非ゼロ終了)
npx prettier --check "**/*.json"

Prettier は JSON と JSONC を標準でサポートします。.prettierrc{ "tabWidth": 2 } のような 2 行で大抵十分です。

VS Code —— 保存時にフォーマット

Prettier 拡張をインストールし、ワークスペースの settings.json に追加します:

{
  "editor.formatOnSave": true,
  "[json]":   { "editor.defaultFormatter": "esbenp.prettier-vscode" },
  "[jsonc]":  { "editor.defaultFormatter": "esbenp.prettier-vscode" }
}

Pre-commit フック

未フォーマットの JSON のコミットを根本から防ぐには、lint-stagedhusky を連携:

// package.json
{
  "lint-staged": { "*.{json,jsonc}": "prettier --write" }
}

# フックをインストール
npx husky add .husky/pre-commit "npx lint-staged"

JSON フォーマット例:Before / After

// 未フォーマット —— 妥当だが読みづらい
{"orders":[{"id":1001,"customer":{"name":"Alice"},"items":[{"sku":"A1","qty":2}]}]}

// フォーマット済み
{
  "orders": [
    {
      "id": 1001,
      "customer": { "name": "Alice" },
      "items": [ { "sku": "A1", "qty": 2 } ]
    }
  ]
}

よくある質問

JavaScript で JSON をフォーマットするには?

JSON.stringify(value, null, 2) を使います —— 第三引数がインデント(2 スペース、4 スペース、または '\t')。既存の JSON 文字列をフォーマットするには先にパース:JSON.stringify(JSON.parse(raw), null, 2)

コマンドラインで JSON を pretty-print するには?

jq . file.json(デフォルトでフォーマット)、または jq が無ければ python3 -m json.tool file.json--sort-keys を加えるとアルファベット順にソートできます。

フォーマットと minify の違いは?

フォーマットは可読性のために空白を加え、minify は容量縮小のために除きます。互いに逆操作で、データは保持されます。逆操作は How to Minify JSON を参照。

JSON をフォーマットするとデータは変わりますか?

いいえ。JSON ではインデントと改行は無意味な空白です —— コンパクトでも美化済みでも、どのパーサも同じデータ構造を返します。

JSON をオンラインでフォーマット —— セットアップ不要

コードを書かずにすぐ JSON をフォーマットしたいなら、JSON Fix が即座にフォーマットします。JSON を貼って Format をクリック、結果をコピー。末尾カンマ、シングルクォート、クォートなしキーなどよくあるエラーをフォーマット前に修復するので、まだ妥当でない JSON でも動きます。