Macrotâches et file d’attente des tâches
Comprenez comment les minuteurs et les entrées-sorties sont planifiés.
Macrotâches et file d’attente des tâches est une leçon JavaScript Academy gratuite sur CoddyKit. Ceci est la leçon 2 sur 4. Tu peux lire la leçon complète ci-dessous gratuitement — puis la pratiquer en direct dans le navigateur avec un éditeur de code intégré et un tuteur IA 24/7. Elle fait partie du parcours d'apprentissage JavaScript Academy, et ta progression se synchronise sur le web et l'application CoddyKit. Le cours JavaScript Academy comprend 4 leçons au total.
Qu’est-ce qu’une macro-tâche ?
Une macro-tâche, également appelée tâche, est une unité de travail planifiée pour s’exécuter plus tard, après la fin du code synchrone actuel. Les fonctions de rappel de setTimeout en sont l’exemple classique.
Les macro-tâches attendent dans la file d’attente des tâches jusqu’à ce que la pile d’appels soit vide.
setTimeout reporte le travail
setTimeout enregistre une fonction de rappel qui s’exécutera plus tard. Même avec un délai de 0, elle s’exécute après tout le code synchrone actuel.
console.log('first');
setTimeout(() => console.log('third (timeout)'), 0);
console.log('second');La file d’attente des tâches
Lorsqu’un minuteur se déclenche, sa fonction de rappel est placée dans la file d’attente des tâches. La boucle d’événements ne prend une tâche dans cette file que lorsque la pile d’appels est vide, l’exécute jusqu’au bout, puis vérifie à nouveau.
console.log('sync start');
setTimeout(() => console.log('task 1'), 0);
setTimeout(() => console.log('task 2'), 0);
console.log('sync end');Les tâches s’exécutent dans l’ordre de leur mise en file
Les tâches ayant le même délai s’exécutent dans l’ordre où elles ont été planifiées. La file d’attente des tâches suit le principe FIFO : premier entré, premier sorti.
setTimeout(() => console.log('A'), 0);
setTimeout(() => console.log('B'), 0);
setTimeout(() => console.log('C'), 0);
console.log('sync');Le délai est minimal, pas exact
Le délai transmis représente le temps minimal avant que la fonction de rappel puisse s’exécuter. L’exécution réelle n’a lieu qu’une fois la pile vidée et les tâches précédentes terminées ; elle peut donc être plus tardive.
setTimeout(() => console.log('100ms'), 100);
setTimeout(() => console.log('0ms'), 0);
console.log('synchronous runs first');Trier selon le délai
Des délais différents modifient l’ordre : les délais plus courts deviennent admissibles plus tôt et s’exécutent donc généralement avant les délais plus longs, quel que soit l’ordre de planification.
setTimeout(() => console.log('50'), 50);
setTimeout(() => console.log('10'), 10);
setTimeout(() => console.log('30'), 30);
console.log('start');Une tâche par tour de boucle
La boucle d’événements exécute exactement une macro-tâche par tour, puis effectue d’autres opérations avant le suivant. Cela permet au système de rester réactif entre les tâches.
console.log('1');
setTimeout(() => {
console.log('2');
setTimeout(() => console.log('4'), 0);
}, 0);
setTimeout(() => console.log('3'), 0);Les minuteurs imbriqués sont mis en file plus tard
Un minuteur planifié à l’intérieur d’une tâche rejoint la file derrière les tâches qui attendent déjà, et s’exécute donc lors d’un tour de boucle ultérieur.
setTimeout(() => {
console.log('outer');
setTimeout(() => console.log('inner nested'), 0);
}, 0);
setTimeout(() => console.log('sibling'), 0);setInterval produit aussi des macro-tâches
setInterval planifie une macro-tâche répétée. Ici, nous exécutons quelques itérations et nous arrêtons le processus avec clearInterval afin de limiter la sortie.
let count = 0;
const id = setInterval(() => {
count++;
console.log('tick ' + count);
if (count === 3) clearInterval(id);
}, 10);
console.log('interval scheduled');Le synchrone est toujours prioritaire
Quelle que soit la faible durée du délai, chaque macro-tâche attend derrière tout le code synchrone de l’exécution actuelle. La pile doit d’abord être vide.
setTimeout(() => console.log('macrotask'), 0);
for (let i = 1; i <= 3; i++) console.log('sync ' + i);
console.log('done sync');Pourquoi les macro-tâches sont importantes
Les macro-tâches permettent de reporter du travail sans bloquer. Découper une opération lourde en segments temporisés permet à une application de rester réactive. Cependant, les macro-tâches ne sont pas prioritaires : les micro-tâches (promesses) s’exécutent avant la macro-tâche suivante, comme vous allez le voir.
console.log('schedule');
setTimeout(() => console.log('runs after sync'), 0);
console.log('still sync');Vérification rapide
Quand la fonction de rappel setTimeout(cb, 0) s’exécute-t-elle ?
Récapitulatif : macro-tâches
Vous avez appris comment le travail différé est planifié :
- Les macro-tâches (
setTimeout,setInterval) attendent dans la file d’attente des tâches. - La file suit le principe FIFO ; la boucle d’événements exécute une tâche par tour.
- Le délai est minimal et le code synchrone s’exécute toujours en premier.
- Les micro-tâches sont prioritaires, comme vous allez l’explorer ensuite.
Questions Fréquemment Posées
La leçon « Macrotâches et file d’attente des tâches » est-elle gratuite ?
Oui — le texte complet de « Macrotâches et file d’attente des tâches » est gratuit à lire ici sur le web. Pour la pratiquer de manière interactive (un éditeur de code intégré et un tuteur IA 24/7) et déverrouiller le reste du cours JavaScript Academy, passe à CoddyKit PRO. Le cours JavaScript Academy comprend 4 leçons au total.
Qu'est-ce que j'apprendrai dans « Macrotâches et file d’attente des tâches » ?
Comprenez comment les minuteurs et les entrées-sorties sont planifiés. Tu pratiques JavaScript Academy avec du code pratique que tu exécutes directement dans le navigateur, et un tuteur IA 24/7 répond à tes questions au fur et à mesure que tu avances dans la leçon.
Dois-je avoir de l'expérience pour commencer JavaScript Academy ?
Aucune expérience préalable n'est requise. JavaScript Academy sur CoddyKit est structuré pour les débutants jusqu'aux apprenants avancés, donc tu peux commencer ici ou depuis le début et avancer à ton rythme. Ceci est la leçon 2 sur 4.
Combien de temps prend la leçon « Macrotâches et file d’attente des tâches » ?
La plupart des leçons CoddyKit prennent environ 5–10 minutes. Chacune est courte et interactive, tu progresses régulièrement et tu repiques exactement où tu t'es arrêté sur le web et l'app.
Peux-tu écrire et exécuter du code dans cette leçon JavaScript Academy ?
Oui. Chaque leçon JavaScript Academy inclut un éditeur de code intégré, tu écris et exécutes du vrai code directement dans ton navigateur et tu reçois des retours IA instantanés — aucune configuration locale requise.
Toutes les leçons de ce cours
- La pile d’appels
- Macrotâches et file d’attente des tâches
- Microtâches et promesses
- queueMicrotask et ordre d’exécution