为什么谷歌浏览器控制台延迟？ [复制]答案

【问题标题】：Why is google chromes console delayed? [duplicate]为什么谷歌浏览器控制台延迟？ [复制]
【发布时间】：2012-11-18 21:08:39
【问题描述】：

可能重复：
Is Chrome’s JavaScript console lazy about evaluating arrays?

基本上我发现谷歌浏览器的开发工具存在问题。

以这个sn-p为例：

console.log($(this).find(' .buttons .cancel'));
$(this).find(' .buttons .cancel').remove();

当触发 sn-p 时，如果有两个项目与这些选择器匹配，则谷歌浏览器将输出 [, ]。基本上它是在寻找元素，但显示数据的速度似乎比应有的要慢。

我希望能够记录我正在删除的项目，但就目前而言，我必须先运行它，而不使用 .remove() 行。然后在我知道它正在工作之后，我可以使用 remove() 函数再次运行它。

【问题讨论】：

Err.. 为什么关闭主题投票？这不是编程相关的吗？我想知道我是否做错了什么，或者如果这是一个错误，是否可以采取一些措施使控制台暂时正常工作：/
您可以在记录之前克隆对象。这样，它不应该接受任何更改。
@DanD。当然可以，但实际上在 console.log($(this).find(' .buttons .cancel')); 之后没有任何东西可以更改记录的对象。

【解决方案1】：

考虑以下测试：

因此，对象始终以其首次在 Chrome 开发者控制台中打开时的状态显示。对于（伪）数组，重要的是控制台到达对象时的状态。这可能是在正常的 javascript 返回之后（很难说出原因。也许是性能原因）。

您可以通过始终记录不变的元素来处理此问题，例如：

如果记录不可变对象不是一个选项，您仍然可以在跟踪代码时记录：console.log(document); debugger;

【讨论】：

【解决方案2】：

如果您向谷歌浏览器的console.log() 传递一个不是原始值（如字符串或数字）的对象，它不会立即输出该对象的内容。可能由于一些进程间通信，实际从对象获取数据并输出到控制台会有一些延迟。如果您立即修改同一个对象，这将/可能导致问题，因为您不一定会在控制台中显示正确的内容。

一种解决方法是只将完成的字符串传递给console.log()。由于字符串是不可变的，它们永远不会被其他任何东西改变，所以你不会被console.log()欺骗。

在您的情况下，您将在下一行代码中删除 DOM 元素。由于 Chrome 的计时怪异，这会在 console.log() 实际看到它们并输出它们之前删除 DOM 元素。你可以做这样的事情，它立即显示字符串并将该字符串传递给console.log()：

console.log($(this).find(' .buttons .cancel').toString());

【讨论】：