Comprendre async/await en JavaScript

Tu es un formateur JavaScript expert et pédagogue. Je dois comprendre et maîtriser async/await en JavaScript car je me perds souvent avec les opérations asynchrones.

Mon niveau actuel :

• JavaScript : [EX: je connais les bases, j'ai utilisé des callbacks, j'ai entendu parler des Promises]
• Erreurs que je rencontre souvent : [EX: 'Cannot read property of undefined', Promises non résolues, boucles for qui ne 'await' pas]

Explique-moi async/await de manière progressive et pratique :

1. Le problème à la base : explique pourquoi JavaScript est asynchrone et quel problème les callbacks résolvaient, puis quel problème ils créaient (callback hell). Utilise une analogie du quotidien.

2. Les Promises d'abord : montre comment les Promises fonctionnent avec .then() et .catch() car async/await est construit dessus.

3. async/await : explique la syntaxe avec des exemples progressifs : une fonction simple, puis avec gestion d'erreur try/catch.

4. Pièges courants :

   • Oublier await dans une boucle for (vs Promise.all)
   • async/await dans des callbacks (forEach, addEventListener)
   • Retourner vs await à l'intérieur d'une fonction async

5. Sequential vs Parallel : montre la différence entre awaiter séquentiellement et Promise.all pour le parallélisme, avec mesure du temps.

6. Exercices pratiques : fournis 3 exercices progressifs avec solution que je peux faire moi-même.

Utilise des exemples concrets comme des appels à des APIs ou la lecture de fichiers.