Chrome、Opera 和 Safari 控制台中脚本执行的奇怪结果

Question

这是一个脚本：

for(var i = 0; i < 5; i++) {
  setTimeout(function() { console.log(i); }, 0);
};

理论上它应该在控制台中只输出五个“5”。但是当我们在 Chrome、Opera 或 Safari 控制台中执行它时，结果会出现一些奇怪的数字。 OS 是 macOS Sierra 10.12.1.

例如

Chrome 54.0.2840.98（64 位）：

for(var i = 0; i < 5; i++) {
      setTimeout(function() { console.log(i); }, 0);
    };
2105
⑤ 5

野生动物园 10.0.1:

> for(var i = 0; i < 5; i++) {
      setTimeout(function() { console.log(i); }, 0);
    };
< 6
> for(var i = 0; i < 5; i++) {
      setTimeout(function() { console.log(i); }, 0);
    };
< 11
> for(var i = 0; i < 5; i++) {
      setTimeout(function() { console.log(i); }, 0);
    };
< 16

歌剧 39.0：

for(var i = 0; i < 5; i++) {
      setTimeout(function() { console.log(i); }, 0);
    };
5
⑤ 5                                    VM73:2
for(var i = 0; i < 5; i++) {
      setTimeout(function() { console.log(i); }, 0);
    };
10
⑤ 5                                    VM74:2

你可以自己试试。有趣的是 - HTML 页面中包含的相同代码可以正常工作。根据打开控制台的选项卡，数字会有所不同。它是什么？猜猜它是某种内部循环计数器，但不确定。另一个想法 - 控制台显示正在执行的函数 return 值。也许是。但是 for 没有 return 任何东西。至少它不应该。相同的代码但没有 setTimeout 显示 undefined 而不是奇怪的数字，因为它应该有效。也许有人比我和互联网更了解它。任何想法都受到高度赞赏。对不起我的英语不好。谢谢！

Answer 1

这是最简单的例子：

for(var i = 0; i < 5; i++) setTimeout(function() {})
> 71 (or whatever)

虽然语句没有值，但控制台会尝试 "helpful" 并输出最后计算的表达式返回的内容 - 在本例中它是 setTimeout(...)，returns 超时ID - 一些任意数字。

Answer 2

它可能正在打印 setTimeout 的 return 值。可以使用 clearTimeout 清除它。如果你再次运行你会得到另一个值，因为每个超时都应该有自己唯一的编号来停止它。

与此同时，您可能已过滤控制台以仅显示 errors 将其更改为显示 all 以查看实际日志。我猜 DevTools 现在默认只有 errors。（野生动物园）

Chrome、Opera 和 Safari 控制台中脚本执行的奇怪结果

Strange results of script execution in Chrome, Opera and Safari console

javascript

safari

opera

google-chrome

developer-tools