キリウ君が読まないノート
- ていうかそもそも
console.log()じゃなくてconsole.dir(obj, { depth: null })を使う。 - JSON文字列でよければ、
JSON.stringify(obj, null, 2)の戻りをconsole.log()で出すと綺麗にフォーマットできる。
[ Node.js v10.16.3 ]
console.log() は、ネストになってるオブジェクトを2階層下までしか展開表示しない。それより下は [Object] とか [Array] みたいに表示される。
const obj = {
fn: () => {},
aaa: undefined,
bbb: ['1階層下'],
ccc: {
ddd: ['2階層下'],
eee: {
fff: ['3階層下'],
ggg: {
hhh: ['4階層下'],
iii: {}
}
}
}
};
console.log(obj);{ fn: [Function: fn],
aaa: undefined,
bbb: [ '1階層下' ],
ccc: { ddd: [ '2階層下' ], eee: { fff: [Array], ggg: [Object] } } }微妙にインデントも謎。
それはともかく、ネストが深いオブジェクトの中身を全て見たいときは他の方法が必要。
JSONで表示する
こういう時、私はよく JSON.stringify() に第三引数を指定した結果を console.log() で表示していた。第三引数にはインデントに使う半角スペースの数を指定する。
これならネストの一番下まで表示できるし、綺麗で読みやすい。が、ものがJSONなのでオブジェクト内に関数や undefined があると欠損してしまう。
const obj = {
fn: () => {},
aaa: undefined,
bbb: ['1階層下'],
ccc: {
ddd: ['2階層下'],
eee: {
fff: ['3階層下'],
ggg: {
hhh: ['4階層下'],
iii: {}
}
}
}
};
console.log(JSON.stringify(obj, null, 4));{
"bbb": [
"1階層下"
],
"ccc": {
"ddd": [
"2階層下"
],
"eee": {
"fff": [
"3階層下"
],
"ggg": {
"hhh": [
"4階層下"
],
"iii": {}
}
}
}
}ちなみに、JSONにするだけなら console.log() だけでもできるらしい。第一引数に %j を含む文字列を指定して、第二引数にオブジェクトを渡すと %j がJSON文字列で置換される。
// 前略
console.log('%j', obj);{"bbb":["1階層下"],"ccc":{"ddd":["2階層下"],"eee":{"fff":["3階層下"],"ggg":{"hhh":["4階層下"],"iii":{}}}}}インデントが無くて読みづらいけど、一応最下層まで表示することはできている。
console.dir() で表示する
リファレンス読むまで知らなかったけど、console.dir() はオブジェクトを何階層下まで出力するかを第二引数で指定できる模様。
第二引数はオプションのオブジェクト。そこに depth: null を指定すると、一番下まで出力してくれる。(デフォルト値は depth: 2)
const obj = {
fn: () => {},
aaa: undefined,
bbb: ['1階層下'],
ccc: {
ddd: ['2階層下'],
eee: {
fff: ['3階層下'],
ggg: {
hhh: ['4階層下'],
iii: {}
}
}
}
};
console.dir(obj, { depth: null });{ fn: [Function: fn],
aaa: undefined,
bbb: [ '1階層下' ],
ccc:
{ ddd: [ '2階層下' ],
eee: { fff: [ '3階層下' ], ggg: { hhh: [ '4階層下' ], iii: {} } } } }インデントが謎なのは同じだけど、デバッグ用途ならJSONにするよりこっちの方が良い。
