Chrome开发者工具中奇怪的console.log行为[重复]

Posted

技术标签:

【中文标题】Chrome开发者工具中奇怪的console.log行为[重复]【英文标题】:Bizarre console.log behaviour in Chrome Developer Tools [duplicate] 【发布时间】:2011-05-11 01:54:19 【问题描述】:

可能重复:Is Chrome's javascript console lazy about evaluating arrays?

打开 Chrome 开发者工具并输入:

var a = [];console.log(a);a.push(1);console.log(a);

你会期望这会输出类似

[]
[1]

但它却输出

[1]
[1]

行为是一样的

var a = [];console.log(a);a[0] = 1;console.log(a);

谁能解释这种行为?

在 OS X 上运行 Chrome。在 32 位 Windows 7 上的行为相同。

编辑:无论语句是否在同一行,行为都是相同的。我只是在一行中提供了它们以便于测试。

投入

var a = [];
console.log(a);
a.push(1);
console.log(a);

在一个文件中运行它会产生相同的行为。

编辑 x 2 如果您不想制作文件进行测试,请参阅:http://jsfiddle.net/9N4A6/。

【问题讨论】:

我的猜测是对 console.log(a) 的调用将数组对象排队等待打印,但数组到字符串的转换只有在整行完成后才会发生。 @CMS:没看到 - 谢谢 不客气@Jamie :) ***.com/questions/4057440/…的可能重复 【参考方案1】:

试试这个:

var a = []; console.log(a.toString()); a.push(1); console.log(a.toString());

我敢打赌,这并不是评估的顺序很奇怪,而是对象到可打印形式的转换发生在语句全部执行之后,此时 Chrome 已准备好实际转储日志。

【讨论】:

嗯,`var a = [];console.log(a[0]);a[0] = 1;console.log(a[0]);'按预期工作,因此有时 console.log 在打印之前不会执行所有语句。 @maarons,实际上即使打印延迟也是如此......它将值 1 发送到 console.log(),这是缓存然后显示的内容。【参考方案2】:

在 x64 机器上与 Win7 相同的行为。我的猜测是 log 方法包含对 a 的引用,并将恰好在一行中的调用排队。

编辑 这不仅仅是 Chrome/ium 的问题,我在 Firebug 上也看到了同样的情况。正如我所说,控制台日志记录必须以某种方式排队。

【讨论】:

当它们不在一行时会发生相同的行为。我只是在一行中完成了它,以便人们更容易粘贴和测试。 不行,使用多个语句时无法确认问题。按预期工作。我应该补充一点,我正在使用 Chromium 构建。 在此处打开控制台:jsfiddle.net/9N4A6【参考方案3】:

是的,它也在对象上这样做......如果您稍后更改值(例如,几秒钟后)然后在控制台中展开对象,新值将在那里。很奇怪,但在某种意义上是有用的。

如果您想要当前值,只需说“console.log(a.toString());”之类的。

【讨论】:

【参考方案4】:

至少使用数组,您可以为每个日志调用克隆数组:

var a = [];console.log([].concat(a));a.push(1);console.log([].concat(a));

对于对象,我推荐 JSON:

var a = ;console.log(JSON.stringify(a));a[0]=1;console.log(JSON.stringify(a));

【讨论】:

【参考方案5】:

“记录”的是对象“a”...而不是“a”的纯文本表示。日志显示足够聪明,可以显示对象“a”的占位符,该占位符“稍后”填充/填充(似乎在事件调用结束时)。如果你坚持一个 alert() 语句,你会看到你期望的值(记录的值被“填充”):

var a = [];
console.log(a);
alert('force console to display correctly');
a.push(1);
console.log(a);

对我来说,这似乎是 Chrome 中的一个错误(必须放入警报语句才能看到正确的日志记录信息有点愚蠢)。

(注意这个问题显示在谷歌搜索“console.log chrome only shows current values”的顶部,所以我想我会添加我的答案)

【讨论】:

这不是 Chrome 问题,而是 Webkit 问题。同样的错误也会在 Safari 中发生。

以上是关于Chrome开发者工具中奇怪的console.log行为[重复]的主要内容,如果未能解决你的问题,请参考以下文章

Chrome中奇怪的document.cookie行为[重复]

Chrome/Chromium 中奇怪的对角线(错误?)

使用标准 VS 2010 模板的 chrome 中奇怪的额外填充

Firefox 中奇怪的表格渲染

Firefox中奇怪的textarea行为:添加空格后文本中断

删除视觉工作室中奇怪的蓝色框