的console.log（）异步或同步？ [英] console.log() async or sync?

问题描述

我目前由Trevor伯纳姆阅读异步的JavaScript 。这是一个伟大的书至今。

I am currently reading Async Javascript by Trevor Burnham. This has been a great book so far.

他谈到了这个片段，并正在执行console.log在Safari和Chrome控制台'异步'。不幸的是我不能复制这一点。这里是code：

He talks about this snippet and console.log being 'async' in the Safari and Chrome console. Unfortunately I can't replicate this. Here is the code:

var obj = {}; 
console.log(obj); 
obj.foo = 'bar';
// my outcome: Object{}; 'bar';
// The book outcome: {foo:bar};

如果这是异步，我预计的结果是书籍的结果。的console.log（）被放入事件队列，直到执行所有code，那么它跑了，这将有酒吧属性。

If this was async, I would anticipate the outcome to be the books outcome. console.log() is put in the event queue until all code is executed, then it is ran and it would have the bar property.

看起来虽是同步运行。

我正在运行此code错了吗？是CONSOLE.LOG实际上异步？

Am I running this code wrong? Is console.log actually async?

推荐答案

的console.log 不规范，这样的行为是相当不确定的，并且可以轻易改变发行版的开发工具。你的书很可能是过时的，因为可能我的回答很快。

console.log is not standardized, so the behavior is rather undefined, and can be changed easily from release to release of the developer tools. Your book is likely to be outdated, as might my answer soon.

要我们code，它没有任何区别的console.log 是否异步与否，它不提供任何形式的回调左右;和你传递总是引用，并计算出当时的值调用该函数。

To our code, it does not make any difference whether console.log is async or not, it does not provide any kind of callback or so; and the values you pass are always referenced and computed at the time you call the function.

我们真的不知道，然后会发生什么（OK，我们可以，因为萤火虫，铬Devtools和Opera蜻蜓都是开源的）。控制台将需要在一些地方保存的记录值，它会显示在屏幕上。渲染将肯定（被节流限速更新）异步发生，因为在控制台登录对象将未来的相互作用（比如扩对象的属性）。

We don't really know what happens then (OK, we could, since Firebug, Chrome Devtools and Opera Dragonfly are all open source). The console will need to store the logged values somewhere, and it will display them on the screen. The rendering will happen asynchronously for sure (being throttled to rate-limit updates), as will future interactions with the logged objects in the console (like expanding object properties).

所以，控制台可能不是克隆（序列化）的可变对象，你没有登录，否则会引用存储它们。第一个不深的对象很好地工作。另外，至少在控制台中的初始渲染可能会显示该对象的当前的状态，即之一，当它得到了记录 - 在你的例子中，你看到对象{} 。

So the console might either clone (serialize) the mutable objects that you did log, or it will store references to them. The first one doesn't work well with deep objects. Also, at least the initial rendering in the console will probably show the "current" state of the object, i.e. the one when it got logged - in your example you see Object {}.

然而，当你展开对象，以进一步检查其属性，它是可能的控制台将只存储到你的对象及其属性的引用，现在显示他们，那么将显示其当前（已突变）的状态。如果你点击 + ，你应该能够看到栏属性在你的例子。

However, when you expand the object to inspect its properties further, it is likely that the console will have only stored a reference to your object and its properties, and displaying them now will then show their current (already mutated) state. If you click on the +, you should be able to see the bar property in your example.

下面是被张贴在 bug报告解释截图他们的修复：

Here's a screenshot that was posted in the bug report to explain their "fix":

所以，一些值可能会被长他们已记录后参考，以及这些的评价是相当的懒惰的（需要时）。这种差异的最有名的例子在提问<一处理href=\"http://stackoverflow.com/questions/4057440/is-chromes-javascript-console-lazy-about-evaluating-arrays\">Is Chrome的JavaScript控制台懒惰有关评估数组？一个解决方法是确保随时登录你的对象序列化的快照，例如通过执行的console.log（JSON.stringify（OBJ））。这将仅适用于非圆形，而小物件的工作，虽然。另请参见的console.log在当前状态对象。

So, some values might be referenced long after they have been logged, and the evaluation of these is rather lazy ("when needed"). The most famous example of this discrepancy is handled in the question Is Chrome's JavaScript console lazy about evaluating arrays? A workaround is to make sure to log serialized snapshots of your objects always, e.g. by doing console.log(JSON.stringify(obj)). This will work for non-circular and rather small objects only, though. See also console.log object at current state.

这篇关于的console.log（）异步或同步？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！