Tenha cuidado com setTimeout em loops

setTimeout é uma ótima ferramenta em JavaScript, mas tem suas desvantagens e problemas dos quais você deve estar ciente:

Não existe uma maneira entre navegadores de passar um retorno de chamada de tempo limite com argumentos. Apenas navegadores modernos suportam a seguinte sintaxe:

setTimeout(myFunction, 1000, myVariable);

Existem soluções alternativas semelhantes a estas:

setTimeout(function(){
myFunction
(myVariable);
}, 1000);

mas isso leva ao seguinte problema:

As variáveis ​​que você está passando não mantêm seus valores iniciais , então se você estiver alterando-as (como em um loop for), esteja ciente:

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

Isso produzirá o valor 6cinco vezes, o que não é a intenção.

Felizmente, há uma solução alternativa para isso

Defina o tempo limite de dentro de uma função

for (i = 1; i <= 5; ++i) {
setDelay
(i);
}

function setDelay(i) {
setTimeout
(function(){
console
.log(i);
}, 1000);
}

E aí está! Também é um pouco mais elegante para projetos maiores.