console.log()でオブジェクトの階層が深い場合に[Object]となる場合の対処法

console.log()でオブジェクトの階層が深い場合に[Object]となる場合の対処法

console.log()でオブジェクトを表示すると、ある程度の階層までは表示されるのですが、深すぎると[Object]となってしまい、表示されなくなってしまいます。

const obj = { a: { b: { c: { d: {} } } } }
console.log(JSON.stringify(obj)) // { a: { b: { c: [Object] } } }と表示される

view raw
gistfile1.txt
hosted with ❤ by GitHub

これを表示するにはJSON.stringify()を使用します。

const log = { a: { b: { c: { d: {} } } } }
console.log(JSON.stringify(log)) // {"a":{"b":{"c":{"d":{}}}}}と表示される

view raw
gistfile1.txt
hosted with ❤ by GitHub

JSON.stringify()の第三引数

JSON.stringifyには引数が3つあって、3つ目に数値で「2」と指定すると整形されます。インデントが2となります。文字列で\tと指定するとタブとなります。

const log = { a: { b: { c: { d: {} } } } }
console.log(JSON.stringify(log, null, 2))
/*
↓こんな感じで表示されます
{
"a": {
"b": {
"c": {
"d": {}
}
}
}
}
*/
console.log(JSON.stringify(log, null, '\t'))
/*
↓こんな感じで表示されます
{
"a": {
"b": {
"c": {
"d": {}
}
}
}
}
*/

view raw
gistfile1.txt
hosted with ❤ by GitHub

JSON.stringify()の第二引数

第二引数では第一引数のオブジェクトのキーを文字列の配列で指定します。

第二引数で指定されたkey-valueのみ表示されるようになります。

console.log(JSON.stringify({ a: 1, b: 2, c: 3 }, ['a'])) // {"a":5}と表示される

view raw
gistfile1.txt
hosted with ❤ by GitHub

ちょっと難しい使い方として、replacerというコールバック関数を指定します。

ユースケースがあまり思いつきませんが、JSのErrorオブジェクトをconsole.logで表示したい場合はこのreplacerを使えばエラー内容を表示することができます。

コールバック関数の第一引数はオブジェクトのkey,第二引数はオブジェクトのvalueとなります。以下はErrorオブジェクトの場合の出力例です。

const err = new Error('error message')
console.log(
JSON.stringify(err, function(key, val) {
return JSON.stringify(val, Object.getOwnPropertyNames(val)) // Errorオブジェクトの場合、keyが''となる
})
)

view raw
gistfile1.txt
hosted with ❤ by GitHub

Object.getOwnPropertyNames()

valueが関数の場合、key-valueが消える

オブジェクトの値が関数の場合、そのキーごと消えてしまいます。

const log = { a: { b: { c: { d:function(){return 1;}} } } }
console.log(JSON.stringify(log)) // { a: { b: { c: {} } } }と表示されてしまう

view raw
gistfile1.txt
hosted with ❤ by GitHub

util.inspectを使う

nodeのバージョン9くらいからutil.inspectでオブジェクトを文字列化してくれます。

depth:nullオプションを指定することで、階層が深くてもvalueが関数であっても表示されるようになります。

const util = require('util')
console.log(util.inspect({a:{b:{c:{d:{e:{f:(ret)=> ret}}}}}}, {depth: null}))

view raw
gistfile1.txt
hosted with ❤ by GitHub

Node.jsでutil.debuglogを使用してログ出力する方法」info, warnを使えばもっと便利です。

info(util.inspect({a:{b:{c:{d:{e:{f:(ret)=> ret}}}}}}, {depth: null}))

view raw
gistfile1.txt
hosted with ❤ by GitHub

スポンサーリンク
  • このエントリーをはてなブックマークに追加
  • Evernoteに保存Evernoteに保存
スポンサーリンク

コメントをどうぞ

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

CAPTCHA