La pile d’appels
Observez comment les appels de fonctions sont suivis.
La pile d’appels est une leçon JavaScript Academy gratuite sur CoddyKit. Ceci est la leçon 1 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 que la pile d’appels ?
La pile d’appels est le mécanisme par lequel JavaScript suit la fonction en cours d’exécution et l’endroit où il doit reprendre. Chaque appel de fonction est empilé au sommet ; lorsqu’il se termine, il est retiré.
Il s’agit d’une structure LIFO : dernier entré, premier sorti.
Empiler et dépiler
Lorsque vous appelez une fonction, une trame de pile est empilée. Lorsqu’elle renvoie une valeur, la trame est retirée. Observez l’ordre des messages de journalisation lorsque les appels s’imbriquent.
function first() {
console.log('first start');
second();
console.log('first end');
}
function second() {
console.log('second');
}
first();LIFO en action
La fonction appelée le plus récemment doit se terminer avant que celle située en dessous puisse reprendre. L’appel interne se termine en premier, même s’il a commencé en dernier.
function a() {
console.log('enter a');
b();
console.log('exit a');
}
function b() {
console.log('enter b');
c();
console.log('exit b');
}
function c() {
console.log('c runs');
}
a();Le synchrone signifie bloquant
JavaScript exécute une seule chose à la fois sur un seul fil d’exécution. Tant que la pile contient des trames, rien d’autre ne s’exécute. Le code synchrone bloque jusqu’à sa fin.
console.log('start');
function busy() {
let sum = 0;
for (let i = 0; i < 1000; i++) sum += i;
return sum;
}
console.log(busy());
console.log('end');Les valeurs de retour redescendent
À mesure que chaque trame est retirée, sa valeur de retour remonte jusqu’à l’appelant qui l’attend plus bas dans la pile.
function square(n) {
return n * n;
}
function sumOfSquares(a, b) {
return square(a) + square(b);
}
console.log(sumOfSquares(3, 4));La récursivité fait grandir la pile
Chaque appel récursif ajoute une nouvelle trame. La pile grandit jusqu’à atteindre le cas de base, puis se déroule trame par trame.
function countdown(n) {
if (n === 0) {
console.log('liftoff');
return;
}
console.log(n);
countdown(n - 1);
}
countdown(3);Dépassement de la pile
La pile a une taille limitée. Une récursivité sans cas de base continue d’empiler des trames jusqu’à ce que le moteur lève RangeError : taille maximale de la pile d’appels dépassée.
function endless(n) {
return endless(n + 1);
}
try {
endless(1);
} catch (e) {
console.log(e.name);
}L’ordre d’exécution est prévisible
Comme la pile suit strictement le principe LIFO et que l’exécution est synchrone, l’ordre des messages de journalisation synchrones est toujours déterministe. Vous pouvez le retracer à la main.
function outer() {
console.log(1);
inner();
console.log(3);
}
function inner() {
console.log(2);
}
outer();
console.log(4);Quand l’asynchrone intervient
La pile d’appels n’exécute que du code synchrone. Les fonctions comme setTimeout confient le travail à l’environnement, qui place ensuite les fonctions de rappel dans des files d’attente. Ces fonctions de rappel ne s’exécutent qu’une fois la pile vide.
C’est le lien avec la boucle d’événements.
console.log('A');
setTimeout(() => console.log('B (later)'), 0);
console.log('C');La pile doit d’abord être vidée
Même un minuteur de zéro milliseconde attend la fin de tout le code synchrone. La fonction de rappel ne peut pas s’exécuter tant qu’il reste des trames sur la pile.
console.log('sync 1');
setTimeout(() => console.log('timeout'), 0);
console.log('sync 2');
console.log('sync 3');Pourquoi la pile d’appels est importante
Comprendre la pile d’appels explique pourquoi les longues boucles synchrones figent une page, pourquoi la récursivité peut provoquer un dépassement de pile et pourquoi les fonctions de rappel asynchrones s’exécutent toujours en dernier. C’est la base de tout ce qui concerne la boucle d’événements.
function compute() {
return [1, 2, 3].reduce((a, b) => a + b, 0);
}
console.log('before');
console.log(compute());
console.log('after');Vérification rapide
Quel principe d’ordre la pile d’appels suit-elle ?
Récapitulatif : la pile d’appels
Vous avez découvert le cœur de l’exécution du moteur :
- La pile d’appels suit les fonctions en cours d’exécution selon l’ordre LIFO.
- JavaScript est monothread et le code synchrone bloque.
- La récursivité fait grandir la pile et peut provoquer un dépassement.
- Les fonctions de rappel asynchrones attendent que la pile soit vide, ce qui nous mène à la boucle d’événements.
Questions Fréquemment Posées
La leçon « La pile d’appels » est-elle gratuite ?
Oui — le texte complet de « La pile d’appels » 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 « La pile d’appels » ?
Observez comment les appels de fonctions sont suivis. 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 1 sur 4.
Combien de temps prend la leçon « La pile d’appels » ?
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