Comment travaillez-vous avec JavaScript asynchrone?

Je travaille avec l’asynchronie en JavaScript en utilisant des callbacks, des promesses et async/await.

Les callbacks sont des fonctions passées à d’autres fonctions en tant qu’arguments et qui s’exécutent après la fin d’une opération. Ils peuvent conduire à des "enfers de callbacks" en cas d’imbrication.

// Exemple de callback
function fetchData(callback) {
  setTimeout(() => {
    callback("Données reçues");
  }, 1000);
}

fetchData((data) => {
  console.log(data); // Affichera "Données reçues" après 1 seconde
});

Les promesses sont des objets représentant la fin ou l’échec d’une opération asynchrone. Elles simplifient la gestion du code asynchrone, évitant l’imbrication profonde. Elles ont trois états : pending (en attente), fulfilled (réussie), rejected (échouée).

// Exemple de promesse
function fetchDataPromise() {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      resolve("Données reçues");
    }, 1000);
  });
}

fetchDataPromise()
  .then((data) => {
    console.log(data); // Affichera "Données reçues" après 1 seconde
  })
  .catch((error) => {
    console.error("Erreur:", error);
  });

Async/await est un sucre syntaxique sur les promesses qui rend le code asynchrone plus lisible, semblable au synchrone. Une fonction marquée async retourne toujours une promesse. L’opérateur await ne peut être utilisé qu’à l’intérieur d’une fonction async et suspend l’exécution jusqu’à ce que la promesse soit résolue ou rejetée.

// Exemple d’async/await
async function fetchDataAsync() {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      resolve("Données reçues");
    }, 1000);
  });
}

async function processData() {
  try {
    const data = await fetchDataAsync();
    console.log(data); // Affichera "Données reçues" après 1 seconde
  } catch (error) {
    console.error("Erreur:", error);
  }
}

processData();

J’utilise souvent async/await lors de la gestion des requêtes API, car c’est la méthode la plus pratique et lisible pour traiter des opérations asynchrones. Pour exécuter plusieurs opérations asynchrones en parallèle, j’utilise Promise.all() ou Promise.allSettled().

J’utilise la boucle d’événements pour comprendre l’ordre d’exécution du code asynchrone, des micro-tâches et des macro-tâches.