Comprendre l'event loop en JavaScript : pourquoi les microtasks s'exécutent avant les tasks

En JavaScript, l'event loop gère l'ordre d'exécution des tâches asynchrones en distinguant deux files d'attente : la task queue (pour les macros-tâches comme setTimeout) et la microtask queue (pour les micro-tâches comme les Promesses). La règle fondamentale est que la microtask queue est toujours vidée avant la task queue. Ainsi, même si un setTimeout a un délai de 0 milliseconde, il reste une macro-tâche et sera exécuté après les micro-tâches.

Exemple :
Considérons ce code :

console.log('A');
setTimeout(() => console.log('B'), 0);
Promise.resolve().then(() => console.log('C'));
console.log('D');

1. Le code synchrone s'exécute d'abord : on voit A puis D.
2. La fonction de setTimeout est placée dans la task queue.
3. La fonction de la Promesse est placée dans la microtask queue.
4. L'event loop vide la microtask queue : on voit C.
5. Enfin, il vide la task queue : on voit B.

L'ordre final est donc A, D, C, B. Cette logique s'applique aussi à await, qui se comporte comme une micro-tâche.