Asynchrone & event loop

setTimeout();

setTimeout(function() {
    console.log("I'm here!")
}, 5000);

console.log("Where are you?");

La fonction setTimeout (documentation à retrouver ici) nous retourne une valeur permettant d'identifier le code asynchrone que l'on veut exécuter. Il est possible de passer cet identifiant en paramètre à la fonction clearTimeout , si vous souhaitez annuler l'exécution asynchrone de la fonction avant qu'elle ne soit exécutée.

Les autres méthodes

Il existe d'autres méthodes un peu moins répandues, voire très peu utilisées :

  • setInterval (documentation à retrouver ici) : elle fonctionne exactement comme setTimeout , à ceci près qu'elle exécute la fonction passée en paramètre en boucle à une fréquence déterminée par le temps en millisecondes passé en second paramètre. Il suffira de passer la valeur de retour de setInterval à clearInterval pour stopper l'exécution en boucle de la fonction ;

  • setImmediate (documentation à retrouver ici). Cette fonction prend en seul paramètre la fonction à exécuter de façon synchrone. La fonction en question sera placée dans la file d'attente de l'event loop, mais va passer devant toutes les autres fonctions, sauf certaines spécifiques au Javascript : les événements (les mêmes qu'on a vus au premier chapitre, et qui sont donc exécutés de façon asynchrone 😉), le rendu, et l'I/O. Il existe aussi nextTick , qui permet, là, de court-circuiter tout le monde. À utiliser avec précaution, donc...

Callbacks

Trouver un bon exemple

Async / Await avec Promise

async function getNumber1() {
  return 10;
}

async function getNumber2() {
  return 4;
}

async function compute() {
  const value1 = await getNumber1();
  const value2 = await getNumber2();
  return value1 + value2;
}

const result = document.getElementById('result');

compute()
  .then(function(res) {
    result.innerText = res + '';
});

Enchaîner plusieurs Promises :

// la première Promise contient 2 requêtes GET
Promise.all([get(url1), get(url2)])
    .then(function(results) {
        // une fois résolue, la seconde Promise ajoute 1 requête POST
        // all() réunit tout dans un tableau
        return Promise.all([results, post(url3)]);
    })
    .then(function(allResults) {
        // We are done here !
    });

Last updated