如何在Chrome控制台中显示完整对象？

Question

var functor=function(){
    //test
}

functor.prop=1;

console.log(functor);

这只显示了仿函数的函数部分,无法在控制台中显示仿函数的属性.

Answer 1

使用console.dir()输出可浏览的对象,你可以点击,而不是通过.toString()的版本,就像这样:

console.dir(functor);

打印指定对象的JavaScript表示形式.如果记录的对象是HTML元素,则打印其DOM表示的属性^[1]

[1] https://developers.google.com/web/tools/chrome-devtools/debug/console/console-reference#dir

Answer 2

如果你尝试,你可能会得到更好的结果:

console.log(JSON.stringify(functor));

Answer 3

如果你尝试,你甚至可能会得到更好的结果:

console.log(JSON.stringify(obj, null, 4));

Answer 4

var gandalf = {
  "real name": "Gandalf",
  "age (est)": 11000,
  "race": "Maia",
  "haveRetirementPlan": true,
  "aliases": [
    "Greyhame",
    "Stormcrow",
    "Mithrandir",
    "Gandalf the Grey",
    "Gandalf the White"
  ]
};
//to console log object, we cannot use console.log("Object gandalf: " + gandalf);
console.log("Object gandalf: ");
//this will show object gandalf ONLY in Google Chrome NOT in IE
console.log(gandalf);
//this will show object gandalf IN ALL BROWSERS!
console.log(JSON.stringify(gandalf));
//this will show object gandalf IN ALL BROWSERS! with beautiful indent
console.log(JSON.stringify(gandalf, null, 4));

Answer 5

这对我很有用:

for(a in array)console.log(array[a])

您可以提取在控制台中创建的任何数组,以便查找/替换清除和后续使用此提取的数据

Answer 6

我做了一个 Trident D'Gao 答案的函数。

function print(obj) {
  console.log(JSON.stringify(obj, null, 4));
}

如何使用它

print(obj);