JavaScriptでJSONを見やすく整形表示（pretty print）する方法

JSONとは「JavaScript Object Notation（JavaScriptオブジェクト表記）」の略です。そのため、JSON.stringify()には整形表示（pretty-print）機能が標準で組み込まれています。第3引数にインデントとして使用するスペースの数を指定するだけで、読みやすい形式で出力できます。

例：JavaScriptオブジェクトを整形表示する

let a = {
    name: "A",
    age: 35,
    address: {
        street: "32, Baker Street",
        city: "Chicago"
    }
}
console.log(JSON.stringify(a, null, 4))

出力結果

{
    "name": "A",
    "age": 35,
    "address": {
        "street": "32, Baker Street",
        "city": "Chicago"
    }
}

上記の例ではJavaScriptオブジェクトを使用しています。JSON文字列の場合も同じ方法で整形できますが、その際は事前にJSON.parse()を使ってJSON文字列をJavaScriptオブジェクトへ変換しておく必要があります。

例：JSON文字列を整形表示する

let jsonStr = '{"name":"A","age":35,"address":{"street":"32, Baker Street","city":"Chicago"}}'
console.log(JSON.stringify(JSON.parse(jsonStr), null, 2))

出力結果

{
    "name": "A",
    "age": 35,
    "address": {
        "street": "32, Baker Street",
        "city": "Chicago"
    }
}

なお、第3引数には数値の代わりに文字列（例："\t"）を指定することも可能です。数値を指定した場合、インデントは最大10スペースまでに制限される点に注意してください。