JavaScriptLeçon 15 sur 16

Promesses et async/await

Un serveur, un fichier ou un minuteur ne répond jamais tout de suite, et le programme ne doit pas se figer en attendant. Une promesse représente une valeur qui arrive un peu plus tard, et await permet de l’attendre comme si le code s’exécutait dans l’ordre.

L’essentiel

new Promise((resolve, reject) => …) : resolve livre le résultat, reject une erreur
Une fonction async renvoie toujours une promesse, et await y attend le résultat
Les erreurs d’un await se rattrapent avec un try...catch ordinaire
L’ordre : tout le code normal d’abord, puis les promesses, puis les minuteurs, même setTimeout à 0
Promise.all([…]) attend plusieurs promesses à la fois

Exemple

console.log("1: code runs top to bottom");setTimeout(() => console.log("4: a timer, even with 0 ms"), 0);Promise.resolve().then(() => console.log("3: a resolved promise"));console.log("2: still the same pass"); const wait = (ms) => new Promise((resolve) => setTimeout(resolve, ms)); async function later() {  await wait(0);  console.log("5: after await");  return "result";} later().then((value) => console.log("6:", value));

Les numéros montrent l’ordre réel : les lignes normales, puis la promesse, puis le minuteur. later() a attendu un minuteur avec await, et sa valeur de retour est arrivée dans then.

Exercice

Utiliser l’éditeur⌘ Entrée ou Ctrl Entrée lance le code, ⇧ ⌘ Entrée vérifie l’exercice.Tab et Maj Tab indentent la ligne ou la sélection ; Échap puis Tab quitte l’éditeur.La vérification compare ce que le programme a affiché à l’exercice ; les espaces en fin de ligne ne comptent pas.Après deux vérifications ratées, la solution s’ouvre. Votre code reste dans ce navigateur.

Complétez track(id) : attendez getOrder(id) avec await et affichez Order 7: Margherita in 20 min ; si la commande n’existe pas, attrapez l’erreur avec try...catch et affichez son message. Sortie : Checking orders..., Order 7: Margherita in 20 min, Order 9 not found et All done.

// A pretend server: it answers a moment laterfunction getOrder(id) {  return new Promise((resolve, reject) => {    setTimeout(() => {      if (id === 7) resolve({ id, dish: "Margherita", minutes: 20 });      else reject(new Error(`Order ${id} not found`));    }, 0);  });} async function track(id) {  // TODO: await getOrder(id) and print "Order 7: Margherita in 20 min"  // TODO: wrap it in try...catch and print error.message if the order is missing} async function main() {  console.log("Checking orders...");  await track(7);  await track(9);  console.log("All done");} main();

// A pretend server: it answers a moment later
function getOrder(id) {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      if (id === 7) resolve({ id, dish: "Margherita", minutes: 20 });
      else reject(new Error(`Order ${id} not found`));
    }, 0);
  });
}

async function track(id) {
  // TODO: await getOrder(id) and print "Order 7: Margherita in 20 min"
  // TODO: wrap it in try...catch and print error.message if the order is missing
}

async function main() {
  console.log("Checking orders...");
  await track(7);
  await track(9);
  console.log("All done");
}

main();

Sortie

Ce que le programme affiche apparaîtra ici.