javascript - 为什么这个 setTimeout() 调用在控制台中有效，而不是作为 greasemonkey 脚本？

Question

当我在 greasemonkey 脚本的 for() 循环中使用 setTimeout() 时，它似乎根本不起作用。但是，如果我在 Firebug 控制台中运行完全相同的代码，它就可以正常工作。这是代码:

// ==UserScript==
// @name           setTimeout test
// @include        *
// @run-at         document-end
// ==/UserScript=


function test(delaytime) {
    alert("test called with "+delaytime);
}

function test2() {
  for( var i = 0; i < 100; i+= 10 ) {
    setTimeout('test('+i+');', i);
  }
}

setTimeout(test2,10);

如果我用如下所示的显式调用替换 for() 循环，那么它工作正常。

setTimeout(function() { test( 0); },  0);
setTimeout(function() { test(10); }, 10);
setTimeout(function() { test(20); }, 20);
setTimeout(function() { test(30); }, 30);
setTimeout(function() { test(40); }, 40);
setTimeout(function() { test(50); }, 50);
setTimeout(function() { test(60); }, 60);
setTimeout(function() { test(70); }, 70);
setTimeout(function() { test(80); }, 80);
setTimeout(function() { test(90); }, 90);

有什么区别？有什么方法可以让 for 循环生成的 setTimeouts 在 greasemonkey 中工作？

Answer 1

因为当字符串在 setTimeout 触发时被评估以执行函数时，循环已经正常运行并且 i 位于循环的最后一个值。

要在每次调用 setTimeout 时卡住 i 的值，您需要像这样在函数闭包中捕获它:

function test2() {
  for( var i = 0; i < 100; i+= 10 ) {
    setTimeout(function(val) {
        return(function() {test(val);});
    } (i), i);
  }
}

这还有一个好处，就是去掉了 setTimeout 参数中的 eval。