javascript - foreach循环的每次迭代之间的延迟？

Question

所以我正在制作一个 simon says 游戏。此函数显示当前序列。它现在的问题是它并没有真正按照一个好的顺序进行，它有点同时做所有事情。假设颜色是“蓝色”、“红色”和“黄色”，它们将同时熄灭而不是按顺序熄灭。我该如何解决这个问题？

var displaySequence = function(){
    compSequence.forEach(function(color){
        $("#" + color).fadeTo(300, 0.5).fadeTo(300, 1.0);
    })
}

Answer 1

一个没有 jQuery 的解决方案。您将需要使用数组索引在每次调用之间产生等待的错觉，但是每个函数都已经运行。会发生的是:1 秒显示颜色 1，2 秒显示颜色 2...

var displaySequence = function(){
    compSequence.forEach(function(color, index){
        setTimeout(function(){
            $("#" + color).fadeTo(300, 0.5).fadeTo(300, 1.0);
        },
        1000 * index);
    })
}

调整 1000 * 索引以更改延迟。