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

时间:2016-12-03 11:11:46

标签: javascript google-chrome safari opera developer-tools

这是一个脚本:

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

理论上它应该只输出五个&#34; 5&#34;在控制台。但是当我们在Chrome,Opera或Safari控制台中执行它时,除了结果之外还有一些奇怪的数字。操作系统是macOS Sierra 10.12.1。

E.g。

Chrome 54.0.2840.98(64位):

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

Safari 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

Opera 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页面中包含的相同代码可以正常工作。根据打开控制台的选项卡,数字不同。它是什么?猜猜它是某种循环的内部计数器,但不确定。另一个想法 - 控制台显示执行函数的返回值。也许是这样。但for不会返回任何内容。至少它不应该。相同的代码但没有setTimeout显示undefined而不是奇怪的数字,因为它应该有效。也许有人比我和互联网更了解它。任何想法都非常感谢。对不起我的英语不好。谢谢!

2 个答案:

答案 0 :(得分:2)

这是最小的例子:

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

虽然声明没有值,但控制台会尝试“有用”#34;并输出最后评估的表达式返回的内容 - 在这种情况下它返回超时ID setTimeout(...) - 一些任意数字。

答案 1 :(得分:1)

可能会打印setTimeout的返回值。它可用于使用clearTimeout清除它。如果你再次运行它,你会得到另一个值,因为每个超时应该有自己唯一的数字来阻止它。

与此同时,您可能已经过滤了控制台以仅显示错误更改它显示所有以查看实际日志。我猜,DevTools默认只有错误。 (Safari浏览器)