Chrome开发者工具控制台 - 日志堆叠，如何查看重新登录的内容[Screenshot Inside]？

Question

我刚开始在Chrome开发者工具中使用控制台（一般来说是Javascript的新手）。我注意到，当我连续两次记录相同的变量（在这种情况下是一个对象）时，日志会堆叠它并在其旁边放置一个小数字图标。我点击这个想法，我将能够看到该对象两次（因为它已被更新两次），但没有任何反应。

图片以获得更多说明：

正如您所看到的Object下拉列表旁边的蓝色圆圈中有一点“2”。第一个日志的Object.num为3，第二个为4，但我能看到的只是第二个。

任何关于如何查看两个日志的答案都将受到赞赏。

：）

Answer 1

发生这种情况是因为您要记录两次相同的确切对象。即使这不会导致堆叠，你只会看到`num'是4，因为控制台没有 - 据我所知，至少 - 抓住你记录的对象的副本。我同意，这偶尔会有些不方便。

我只想到确保你会获得单独的日志 - 但增加了内存使用量 - 的一种方法是做类似的事情

console.log(JSON.parse(JSON.stringify(obj)));

（这应该至少可以工作。）如果您的对象相对简单易于解释，您可以省略JSON.parse并使用对象的JSON字符串形式进行记录。

我还建议查看debugger;语句 - 只要在JS程序中遇到它，它就会使环境停止执行代码并跳转到脚本调试器。对于你正在调试的任何内容，它可能更适合也可能不适合。

Answer 2

这也发生在我之前。我能找到的唯一解决方案是在两个输出调用之间输出一些东西。例如，如果你有这个：

console.log(var);
...
console.log(var);

制作：

console.log(var);
console.log('asdf');
...
console.log(var);

Answer 3

此自定义log函数将记录对象的“快照”，因此在您的示例中，您将看到每次调用log时反映的对象的更新“num”属性。

通过手动将对象的每个属性记录到“控制台组”中来欺骗它。但是，它最终看起来非常接近正常console.log输出（没有你在问题中指出的奇怪行为）。

此外，它可能仅适用于Chrome。

function log(obj) {
    console.groupCollapsed(({}).toString.call(obj).split(' ')[1].split(']')[0]);
    for (var k in obj) obj.hasOwnProperty(k) && console.log(k + ': ', obj[k]);
    console.log('__proto__: ', obj.__proto__);
    console.groupEnd();
}​

尝试here。

---

顺便说一句，很棒的问题。我刚刚学到了很多关于我以前不知道的控制台的知识。 ：）

Answer 4

根据documentation，可以通过在常规控制台设置中启用时间戳来关闭邮件堆叠：