Il se trouve que je connais intimement les piles de crêpes – des piles courtes, des piles hautes, toutes les piles. Les crêpes sont donc naturellement la première chose qui me vient à l’esprit lorsque j’entends « empiler ». Heureusement, il s’agit d’une métaphore visuelle appropriée pour une pile de logiciels.
Qu’est-ce qu’une pile ?
Les piles logicielles sont un type de données similaire à un tableau qui se comporte comme une collection d’éléments. Dans cet exemple visuel, chaque pancake représente un élément, que nous avons ajouté en haut de la pile ; nous ne pouvons supprimer chaque élément que du haut. En raison de cette structure linéaire, les piles sont également appelées LIFO ou dernier entré, premier sorti.
Les piles ont deux opérations principales : push et pop. Si vous êtes familier avec tableaux, vous serez heureux de savoir que ces méthodes correspondent exactement à ce que vous pensez : Push ajoute un élément en haut de la pile et pop supprime l’élément le plus récemment ajouté du haut. Contrairement à un tableau (ou à une pile de pancakes), il n’est pas possible d’accéder à un élément par le bas ou le milieu sans d’abord supprimer ceux du dessus.
Qu’est-ce qu’une pile d’appels JS ?
Une pile d’appels JavaScript est un exemple de structure de données de pile. Dans une pile d’appels JS, les éléments sont des invocations de fonction. Chaque fois que vous invoquez une fonction, elle est ajoutée à la pile. Si elle a une fonction imbriquée, cette fonction imbriquée sera également ajoutée au sommet de la pile, et ainsi de suite. Vous pouvez considérer la pile d’appels comme une sorte de liste de tâches pour JavaScript.
Piles vs. Pile d’appels JS
Une pile d’appels JavaScript est un exemple de structure de données de pile. Dans une pile d’appels JS, les éléments sont des invocations de fonction. Chaque fois que vous invoquez une fonction, elle est ajoutée à la pile. Si elle a une fonction imbriquée, cette fonction imbriquée sera également ajoutée au sommet de la pile, et ainsi de suite. Vous pouvez considérer la pile d’appels comme une liste de tâches à effectuer pour JavaScript.
Il est important de se rappeler que JavaScript est en grande partie un processus à un seul thread, ce qui signifie que JavaScript traite une commande à la fois. Les actions asynchrones sont gérées différemment et je recommande fortement cette vidéo si vous souhaitez en savoir plus à ce sujet.
Une fois que vous avez poussé toutes les fonctions qui doivent s’exécuter dans un script donné vers le haut de la pile dans l’ordre d’invocation, JavaScript commence à les résoudre dans l’ordre de haut en bas, en les faisant sortir de la pile.
Dans cette vidéo, vous pouvez voir que la fonction printSquare est invoqué en bas de l’écran. La printSquare la fonction est ajoutée à la pile des appels, mais elle ne peut pas être résolue tant qu’elle n’a pas reçu le retour de sa fonction imbriquée appelée square. La fonction square est maintenant ajoutée à la pile des appels, mais elle ne peut pas être résolue tant qu’elle n’a pas reçu le retour de son fonction imbriquée appelée multiply. La multiply La fonction est poussée en haut de la pile, et comme elle a une instruction de retour qui peut être renvoyée immédiatement, elle continue et se termine et est retirée du haut de la pile. La pile d’appels continue de cette manière, désactivant les fonctions dans l’ordre inverse de l’ordre dans lequel elles ont été appelées.
Faire des recherches pour cet article était un peu comme gérer ma propre pile d’appels. Lorsque j’ai commencé une ligne de recherche, cela a inévitablement soulevé une question imbriquée, que je devais ajouter en haut de ma propre liste de « choses à faire » pour comprendre avant de continuer ; Au cours de la recherche de cette deuxième question, je suis tombé sur un autre sujet que j’ai ajouté en haut de ma liste avant de continuer avec le sujet précédent, et ainsi de suite, plusieurs fois. Résoudre la question la plus récente que j’ai ajoutée m’a permis de la supprimer du haut de la liste et de continuer avec la question suivante en dessous jusqu’à ce que je me retrouve au niveau un, prêt à écrire ce blog !
Comment pratiquer avec des piles
Le navigateur Chrome a un très robuste panneau des outils de développement. L’une des choses que vous pouvez faire avec le panneau est parcourir le code ligne par ligne et voyez-le pousser sur la pile. Pour l’ouvrir, faites un clic droit (ou tapez Cmd + option + j) sur n’importe quelle page Web dans Chrome, choisissez l’option Inspecter et l’onglet Sources en haut. J’ai fait une petite vidéo avec une démonstration d’appel de pile en utilisant le point d’arrêt et les outils pas à pas.
J’ajoute le point d’arrêt au aDayInTheLife invocation de fonction, qui interrompt le code et nous permet de parcourir chaque fonction en cascade. Comme vous pouvez le voir, les fonctions sont ajoutées à la pile de bas en haut, puis sont résolues de haut en bas au fur et à mesure que les fonctions reçoivent leurs valeurs de retour et sont résolues. En fin de compte, la chaîne “Made the bus in seconds flat” est renvoyée à l’original aDayInTheLife fonction et renvoyée dans la console à la toute fin une fois la pile effacée.
Qu’est-ce que le débordement de pile ?
Le principe de base est que la mémoire de l’ordinateur est finie, et s’il y a plus d’éléments poussés sur la pile qu’il n’y a d’espace, la pile débordera. La cause la plus courante d’une situation de débordement de pile est une récursivité infinie ou très profonde. UN fonction récursive est une qui s’appelle elle-même – ou imaginez deux fonctions qui s’appellent. La première fonction ajoute la deuxième fonction à la pile des appels, la deuxième fonction ajoute la première fonction à la pile des appels et ainsi de suite. Puisque rien n’est jamais retourné ou résolu, la pile débordera.
Deux fonctions s’appelant entraîneront un débordement de pile.
Comme vous pouvez le voir, l’outil de développement Chrome a une gestion des erreurs pour cela et produira une erreur après 16 000 images (éléments de pile d’appel).
Les Beatles disent bonjour et au revoir pour toujours – aucune gestion des erreurs n’est nécessaire.
Je vous laisse avec un fait amusant : Stack Overflow , le site Web , tire son nom d’un 2008 Horreur de codage sondage publié par les créateurs qui cherchaient de l’aide pour nommer leur site Web. Certaines des autres options étaient humbledeveloper.com et writeoncereadmany.com. 25% des près de 7 000 votes sont allés à stackoverflow.com, ce qui en fait le gagnant, et pour ma part, je pense qu’ils ont choisi le meilleur.
Alors… qui a faim ?
.