在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輝光（）函數，我不相信它的作品無論是。

我在做什麼錯？

來源

2017-07-02 GalleyWest

基本上你想要的（使用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。

來源

2017-07-02 06:34:59 traktor53

在for循環中將「var」更改爲「var」確實改善了這種情況。 – GalleyWest

這是因爲每次的煥發（）函數被調用時，匿名功能的新實例（）創建這是從以前的實例完全不同，它恰巧就在超時的實例X匿名函數的完成，例如ÿ也完成了，這意味着你必須newComp.slice（0，numTurn）。長度匿名函數每一個都有自己的超時時間爲500ms創造一個非常快速的光芒。

來源

2017-07-02 03:21:09

您需要將您的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); 
     }

來源

2017-07-02 03:21:38 Phil

我已更改爲此，現在它只閃爍數組中的最後一項。這導致我相信這個問題可能在其他地方。 – GalleyWest

在Javascript中運行的setInterval運行速度很快

回答

相關問題