JavaScript 15 : promesses, async et await

1. Une opération peut finir plus tard

Une promesse représente une opération en attente, réussie ou échouée. Elle n’est pas directement la valeur finale. Une fonction async renvoie une promesse ; await suspend la suite de cette fonction jusqu’au résultat, sans bloquer toute la page.

2. Exemple autonome, sans serveur

async function chargerCatalogue() {
  return [{ titre: "UML", places: 8 }, { titre: "Python", places: 0 }];
}
async function afficherPlaces() {
  try {
    const cours = await chargerCatalogue();
    const disponibles = cours.filter(c => c.places > 0);
    console.log(disponibles.map(c => c.titre).join(", "));
  } catch (erreur) {
    console.error("Catalogue indisponible", erreur.message);
  }
}
afficherPlaces(); // UML

Le résultat peut être essayé dans la console du navigateur ou avec Node.js. L’exemple sépare le chargement et la sélection : on peut remplacer la source sans changer la règle « places strictement positives ».

3. Lire une réponse HTTP

async function lireCatalogue(url) {
  const reponse = await fetch(url);
  if (!reponse.ok) {
    throw new Error(`Réponse HTTP ${reponse.status}`);
  }
  const donnees = await reponse.json();
  if (!Array.isArray(donnees)) {
    throw new Error("Un tableau était attendu");
  }
  return donnees;
}

Cette fonction se branche sur une URL réelle de votre application : elle ne crée pas de serveur. Une réponse HTTP 404 ne provoque pas automatiquement le rejet de fetch ; on vérifie donc ok. La lecture JSON peut elle-même échouer. Un problème CORS se règle du côté des autorisations du serveur, pas en supprimant la gestion d’erreur.

4. Exercices corrigés

async function reunir(chargerA, chargerB) {
  const [a, b] = await Promise.all([chargerA(), chargerB()]);
  return { a, b };
}