Comment exécuter un rappel une fois les tâches asynchrones forEach terminées ?

Exécuter un rappel une fois les tâches asynchrones forEach terminées

Problème

Comment pouvons-nous exécuter une fonction de rappel une fois toutes asynchrones les opérations dans une boucle forEach ont-elles été terminées ?

Answer

Array.forEach ne fournit pas de solution prête à l'emploi pour ce scénario, mais il existe diverses approches pour obtenir la fonctionnalité souhaitée.

Utilisation d'un compteur

<br>function callback() { console.log('all done'); ></p>
<p>var itemsProcessed = 0;</p>
<p>[1, 2, 3].forEach(item => {<br> asyncFunction(item, () => {</p>
<div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:php;toolbar:false">itemsProcessed++;
if(itemsProcessed === array.length) {
  callback();
}

Copier après la connexion

});
});

Cette approche utilise un compteur qui est incrémenté à chaque fois qu'une opération asynchrone est terminée. Une fois que le compteur atteint le nombre total d'éléments dans le tableau, la fonction de rappel est invoquée.

Utilisation des promesses ES6

• Exécution synchrone :
  < ;pre>
  const requêtes = [1, 2, 3].reduce((promiseChain, item) => {
  return promiseChain.then(() => new Promise((resolve) => {
  asyncFunction(item, solve);
  }));
  }, Promise.resolve());

requests.then(() => console. log('done'))

Dans cet exemple, nous enchaînons les promesses pour garantir que chaque opération asynchrone se termine avant le démarrage de la suivante.

• Exécution asynchrone :
  

  <br>const request = [1,2,3].map((item) => {<br>return new Promise((resolve) = > {<br> asyncFunction(item, solve);<br>});<br>})</li></ul>
  <p>Promise.all(requests).then(() => console.log ("done"));<br>

  Dans ce cas, nous utilisons la méthode Promise.all pour exécuter toutes les opérations asynchrones simultanément, puis invoquons le rappel lorsqu'elles sont toutes terminées.

  Utilisation d'une bibliothèque asynchrone

  Les bibliothèques asynchrones comme async fournissent des mécanismes pour exprimer la fonctionnalité souhaitée avec plus d'élégance.

  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!