DébutantNon commencé
Exercice 9.3 · 6 min · 0 tentative
Comprendre async/await
🎯 Objectif
Comprendre les mots-clés async et await pour le code asynchrone.
📖 Contexte
Les opérations réseau (API) prennent du temps. async/await permet d'attendre leur résultat de façon lisible :
async function chargerUtilisateur() {
console.log("Chargement...")
const response = await fetch("/api/user")
const user = await response.json()
console.log("Terminé :", user.name)
}
Les deux mots-clés
| Mot-clé | Rôle |
|---|---|
async | Déclare une fonction asynchrone |
await | Attend la fin d'une opération |
Qu'est-ce qu'une Promise ?
Une Promise (promesse) représente une opération qui n'est pas encore terminée mais qui le sera dans le futur.
// Sans async/await (ancien style, plus complexe)
chargerDonnees().then(data => {
console.log(data)
})
// Avec async/await (moderne, plus lisible)
const data = await chargerDonnees()
console.log(data)
Bonne nouvelle : async/await simplifie le chaînage de .then() que tu viens d'apprendre !
Sans await vs Avec await
// Sans await - résultat = Promise (pas les données)
const resultat = chargerDonnees()
// Avec await - résultat = données (ce qu'on veut)
const resultat = await chargerDonnees()
📝 Consigne
Le code est déjà complet. Observe l'ordre des messages :
- "Début du chargement..."
- "Données reçues !"
- "Utilisateur : Alice"
Résultat attendu :
1. Début du chargement...
2. Données reçues !
3. Utilisateur : Alice
Objectifs
- Utiliser await
- Afficher le début
- Afficher données reçues
- Afficher Alice
Lis bien les instructions et lance-toi !
Indices (0/3)
Indice 1 verrouillé
Indice 2 verrouillé
Indice 3 verrouillé