js implémente les compétences code_javascript d'implémentation de boucle asynchrone

Question
Vous pouvez rencontrer des problèmes lors de la mise en œuvre d'une boucle asynchrone.

Essayons d'écrire une méthode asynchrone qui imprime la valeur d'index de la boucle une fois dans une boucle.

<script>
for(var i = 0; i < 5; i++){
setTimeout(function(){
document.writeln(i);document.writeln("<br />");
},1000);
}
</script>

Le résultat du programme ci-dessus est :

5
5
5
5
5

Raison

Chaque timeout (timeout) pointe vers le i original, pas vers sa copie. Ainsi, la boucle for incrémente i à 5, puis le délai d'attente s'exécute et appelle la valeur actuelle de i (qui est 5).

Solution

Il existe plusieurs façons différentes de copier i. La méthode la plus courante et la plus utilisée consiste à créer une fermeture en déclarant une fonction et en passant i à cette fonction. Nous utilisons ici une fonction d'auto-appel.

Exécutez le code

<script>
for(var i = 0; i < 5; i++){
(function(num){
setTimeout(function(){
document.writeln(num);document.writeln("<br />");
},1000);
})(i);
}
</script>

Sortie

0
1
2
3
4