Comment puis-je implémenter des retards dans les boucles JavaScript pour éviter les itérations qui se chevauchent ?

Implémentation de délais dans les boucles JavaScript

Problème :

L'introduction de délais dans une boucle while JavaScript entraîne souvent l'exécution de la boucle trop rapidement, ce qui conduit à des résultats indésirables. Comment pouvons-nous créer une boucle qui inclut des délais entre les itérations ?

Solution :

La fonction setTimeout(), bien qu'utile pour introduire des délais, est non bloquante et s'exécute immédiatement. En conséquence, plusieurs appels setTimeout() dans une boucle se chevaucheront.

Au lieu de cela, nous pouvons utiliser un modèle de boucle récursive pour obtenir l'effet souhaité. Voici un exemple :

var i = 1;                    // Set counter to 1

function myLoop() {         // Create loop function
  setTimeout(function() {   // Call 3s setTimeout when loop is called
    console.log('hello');   // Your code here
    i++;                    // Increment counter
    if (i < 10) {           // If counter < 10, call loop function again
      myLoop();             // Trigger another setTimeout()
    }                       
  }, 3000)
}

myLoop();                   // Start the loop

Dans cette approche, la fonction myLoop() s'appelle de manière récursive dans le rappel setTimeout(). Chaque itération est retardée de 3 secondes, assurant une exécution séquentielle de la boucle.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!