在Javascript中运行的setInterval运行速度很快
我已经看到了这种信息,但我无法弄清楚为什么我的特定设置在闪烁通过函数这么快。在Javascript中运行的setInterval运行速度很快
这里就是我想要做:
我开一个页面上的广场,我需要以发光,但500毫秒。我将jQuery标识符存储在一个数组中并循环。
function glow(source) {// glows
$(source).addClass("square-active")
setTimeout(function() {
$(source).removeClass("square-active");
}, 500);
}
function iterator() {
var y = 0;
setTimeout(function() {
for (var t=0; t<newComp.slice(0, numTurn).length; t++) {
glow(squareArr[newComp[t]].div)
y = y + 1
}
}, 500 * y)
}
我知道广场正在迭代通过正确,因为我已记录到控制台进行验证目的。我可以看到方格闪烁,但它非常快。
当我尝试来包装的setInterval辉光()函数,我不相信它的作品无论是。
我在做什么错?
基本上你想要的(使用setTimeout
)一组函数每平方的指数,500毫秒除了突出其捕获的安排广场。
function iterator() {
for (let t=0; t<newComp.slice(0, numTurn).length; t++) {
setTimeout(function() {
glow(squareArr[newComp[t]].div)
}, 500 * t)
}
}
使用let
关键字捕捉t
值在其中要求glow
嵌套函数的词法作用域的记录。如果你想恢复y
变量 - 它似乎与t
具有相同的值。
let
的用法很重要。有关如何在不使用let
的情况下捕获闭包内的循环变量值的方法,请参见常见问题JavaScript closure inside loops – simple practical example。
这是因为每次的焕发()函数被调用时,匿名功能的新实例()创建这是从以前的实例完全不同,它恰巧就在超时的实例X匿名函数的完成,例如ÿ也完成了,这意味着你必须newComp.slice(0,numTurn)。长度匿名函数每一个都有自己的超时时间为500ms创造一个非常快速的光芒。
您需要将您的setTimeout移动的内部进行循环
function iterator() {
var y = 0;
for (var t=0; t<newComp.slice(0, numTurn).length; t++) {
setTimeout(function() {
glow(squareArr[newComp[t]].div)
y = y + 1
},500);
}
我已更改为此,现在它只闪烁数组中的最后一项。这导致我相信这个问题可能在其他地方。 – GalleyWest
在for循环中将“var”更改为“var”确实改善了这种情况。 – GalleyWest