Maison  >  Article  >  interface Web  >  Comment garantir que les fonctions asynchrones s'exécutent en séquence ?

Comment garantir que les fonctions asynchrones s'exécutent en séquence ?

Linda Hamilton
Linda Hamiltonoriginal
2024-10-28 01:59:02850parcourir

How to Ensure Asynchronous Functions Execute in Sequence?

Comment séquencer des fonctions asynchrones

La tâche à accomplir est de s'assurer qu'une fonction termine son exécution avant qu'une autre fonction ne commence son exécution. Dans le code fourni, firstFunction() est appelé dans secondFunction(), mais l'appelant a l'intention que secondFunction() attende que firstFunction() se termine avant de continuer.

Approche de la fonction de rappel

Une technique courante pour séquencer du code asynchrone consiste à utiliser des fonctions de rappel. Voici une version révisée du code utilisant des rappels :

<code class="javascript">function firstFunction(callback) {
  // Asynchronous operations go here.
  // When operations complete, invoke the callback function.
  callback();
}

function secondFunction() {
  firstFunction(() => {
    // Code that should execute after firstFunction() completes.
  });
}</code>

Dans cet exemple, firstFunction() prend une fonction de rappel comme argument. Lorsque les opérations asynchrones dans firstFunction() sont terminées, la fonction de rappel est appelée, signalant ainsi à secondFunction() qu'elle est terminée.

Syntaxe de la fonction flèche

Une approche plus récente utilise des fonctions fléchées :

<code class="javascript">firstFunction(() => console.log('Done!'));</code>

Cette syntaxe simplifie la fonction de rappel en utilisant une fonction fléchée (représentée par =>) qui exécute l'action souhaitée lorsque firstFunction() se termine.

Async/Await

Une approche plus moderne et complète consiste à utiliser async/await. Cette méthode implique de définir les fonctions comme asynchrones et d'utiliser le mot-clé wait pour suspendre l'exécution jusqu'à ce qu'une promesse soit résolue :

<code class="javascript">const firstFunction = async () => {
  // Asynchronous operations go here.
  return Promise.resolve(); // Return a promise that resolves when operations complete.
};

const secondFunction = async () => {
  await firstFunction();
  // Code that should execute after firstFunction() completes.
};</code>

Dans firstFunction(), le retour Promise.resolve() indique qu'elle sera résolue lorsque les opérations asynchrones sont terminées. Le mot-clé wait dans secondFunction() garantit qu'il attendra la résolution de la promesse de firstFunction() avant de continuer.

L'un des avantages d'async/await est une meilleure lisibilité du code et une gestion plus propre des erreurs par rapport aux rappels.

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!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn