Il existe des concepts tels que Scope (portée), Scope chain (chaîne de portée), Execute context (contexte d'exécution), Active Object (objet actif), Dynamic Scope (portée dynamique) et Closure (fermeture) en JavaScript. comprenons ces concepts, nous les analysons sous deux aspects : statique et dynamique.
Nous écrivons d’abord une fonction simple à titre d’exemple :
Nous définissons une fonction add avec deux paramètres formels.
Aspect statique :
Lors de la création de la fonction add, le moteur Javascript créera la chaîne de portée de la fonction add. Cette chaîne de portée pointe vers le contexte global. S'il est exprimé graphiquement comme indiqué ci-dessous :
Comme le montre la figure ci-dessus, lorsque la fonction d'ajout est créée, la chaîne de portée a déjà été créée. Par conséquent, nous pouvons conclure que la chaîne de portée de la fonction a été créée lors de la création de la fonction. plutôt que de manière dynamique. Jetons un coup d'œil à ce qui se passe pendant l'exécution dynamique.
Aspects dynamiques :
Lorsque la fonction d'ajout est exécutée, JavaScript créera un contexte d'exécution, qui contient toutes les informations nécessaires pendant l'exécution de la fonction d'ajout. Le contexte d'exécution possède également sa propre chaîne de portée Lorsque la fonction s'exécute, le moteur JavaScript initialise d'abord la chaîne de portée du contexte d'exécution à partir de la chaîne de portée de la fonction d'ajout, puis le moteur JavaScript crée un objet actif, qui contient Tout. variables locales, paramètres, ainsi que d'autres variables pendant l'exécution de la fonction.
Si vous décrivez de manière vivante ce qui se passe pendant l'exécution dynamique de la fonction d'ajout, vous pouvez utiliser la figure suivante pour le décrire :
Comme le montre la figure ci-dessus, le contexte d'exécution est un concept dynamique. Il est créé lorsque la fonction est exécutée. En même temps, l'objet Active Object est également un concept dynamique. Il est référencé par la portée. chaîne du contexte d’exécution. Par conséquent, nous pouvons tirer une conclusion : le contexte d'exécution et les objets actifs sont tous deux des concepts dynamiques, et la chaîne de portée du contexte d'exécution est initialisée par la chaîne de portée de la fonction.
La portée de la fonction mentionnée ci-dessus et la portée du contexte d'exécution. Parlons ensuite de la question de la portée dynamique Lors de l'utilisation de l'instruction with, de la clause catch de try-catch et de la méthode eval en JavaScript, le moteur JavaScript le fera de manière dynamique. modifier la portée du contexte d'exécution. Voyons-le à travers un exemple :
Lorsque la fonction initUI ci-dessus est exécutée, JavaScript créera dynamiquement une portée correspondant à l'instruction with et la placera à l'avant de la chaîne de portée du contexte d'exécution. Le processus ci-dessus peut être décrit de manière vivante à travers la figure suivante. dans la figure ci-dessous est affichée la portée générée par l'instruction with.
Lorsque la fonction assignEvents ci-dessus est exécutée, une fermeture sera créée et cette fermeture fera référence à la variable id dans la portée assignEvents. Si vous suivez l'approche traditionnelle du langage de programmation, id est une variable stockée sur la pile lorsque l'identifiant disparaît. une fois la fonction exécutée, comment peut-elle être à nouveau référencée ? Évidemment, JavaScript adopte ici une autre approche. Jetons un coup d'œil à la façon dont JavaScript implémente les fermetures. Lorsque la fonction assignEvents est exécutée, le moteur JavaScript créera une chaîne de portée du contexte d'exécution de la fonction assignEvents. Cette chaîne de portée contient l'objet actif lorsque assignEvents est exécuté. En même temps, le moteur JavaScript créera également une fermeture et le. portée de la fermeture La chaîne fera également référence à l'objet actif lorsque assignEvent est exécuté, de sorte que lorsque assignEvents est exécuté, bien que la chaîne de portée de son propre contexte d'exécution ne fasse plus référence à l'objet actif, la fermeture fait toujours référence à l'objet actif correspondant au runtime assignEvents. Ceci explique le mécanisme de fermeture à l'intérieur de JavaScipt. La figure suivante peut être utilisée pour décrire de manière vivante la situation pendant l'exécution de la fonction assignEvents ci-dessus :
Comme le montre ce qui précède, une fois la fonction assignEvents exécutée, document.getElementById("save-btn").onclick fait référence à la fermeture, de sorte que lorsque l'utilisateur clique sur save-btn, l'exécution de la fermeture sera être déclenché, alors jetons un coup d'œil à la situation lorsque la fermeture est exécutée. Comme mentionné précédemment, les fermetures en JavaScript sont en fait des fonctions, donc la situation lorsque la fermeture est exécutée est la même que lorsque la fonction est exécutée. La figure suivante décrit de manière vivante la fermeture associée à l'événement onclick ci-dessus.
Comme le montre la figure ci-dessus, le moteur JavaScript crée d'abord le contexte d'exécution de la fermeture, puis utilise la chaîne de portée de fermeture pour initialiser la chaîne de portée de contexte d'exécution de la fermeture, et enfin place l'objet actif correspondant lorsque le La fermeture est exécutée. La saisie de l'extrémité avant de la portée vérifie en outre l'affirmation selon laquelle les fermetures sont des fonctions.
![[Web front-end] Démarrage rapide de Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
