Analyse détaillée et réponses aux principes de fonctionnement de JavaScript

Cet article vous donne une analyse théorique détaillée des principes de fonctionnement de JavaScript et du partage de points de connaissances. Si cela vous intéresse, veuillez l'apprendre.

JavaScript est un langage de script dynamique faiblement typé basé sur les objets (ci-après dénommé JS). Il s'agit d'un langage interprété. Il est différent des autres langages de programmation, tels que Java/C++ et d'autres langages compilés. Ces langages Avant que le code ne soit exécuté, l'intégralité du code sera compilé et d'abord compilé en bytecode (code machine). Puis exécutez. JS ne fait pas cela. JS n'a pas besoin d'être compilé en code intermédiaire, mais peut être exécuté directement dans le navigateur. Le processus d'exécution de JS peut être divisé en deux étapes, la compilation et l'exécution. (Merci de vous référer au livre JS You Don't Know), lorsque le contrôleur JS bascule sur un morceau de code exécutable (ce code exécutable est généré lors de la phase de compilation), le Contexte d'Exécution correspondant (EC pour court). Le contexte d'exécution peut être compris comme l'environnement d'exécution (le contexte d'exécution ne peut être créé que par l'interpréteur JS et ne peut être utilisé que par l'interpréteur JS. Les utilisateurs ne peuvent pas utiliser « l'objet »).

L'environnement d'exécution en JS est divisé en trois catégories :

• Environnement global : Lorsque le moteur JS entre dans un bloc de code, tel que Rencontrer la balise <script>xxx</script> signifie entrer dans un environnement d'exécution global

• Environnement de fonction : lorsqu'une fonction est appelée, une exécution de fonction est formée à l'intérieur de l'environnement de fonction.

• eval() : Exécutez la chaîne en tant que code JS seul. Il n'est pas recommandé d'utiliser

Plusieurs erreurs peuvent se produire dans un morceau. du code JS.Un contexte d'exécution.En JS, une structure de données telle qu'une pile est utilisée pour gérer le contexte d'exécution.Les caractéristiques de la pile sont "premier entré, dernier sorti, dernier entré, premier sorti". s'appelle une pile d'appels de fonction.

Caractéristiques du contexte d'exécution

• Le bas de la pile est toujours le contexte d'exécution global, et il n'y en a qu'un seul

• Le contexte d'exécution global n'apparaîtra dans la pile que lorsque le navigateur est fermé

• Il n'y a pas de limite au nombre d'autres contextes d'exécution

• Le haut de la pile est toujours le contexte d'exécution actif actuel, le reste est dans un état d'attente, une fois l'exécution terminée, la pile est immédiatement sautée, puis le contrôle est rendu au contexte d'exécution suivant

• La fonction n'est appelée qu'à chaque fois, un contexte d'exécution sera créé pour elle, qui n'existe pas lorsque la fonction est déclarée.

Le contexte d'exécution peut être clairement compris comme un objet JS ordinaire. Le cycle de vie d'un contexte d'exécution se compose grossièrement de deux phases :

Phase de création

Cette phase complète principalement trois événements, 1. Créer un objet variable 2. Établir la chaîne de portée 3. Déterminer ce point

Phase d'exécution

Cette phase se termine principalement affectation de variables, appel de fonction et autres opérations

Le processus de création d'objets variables (VO)

• Créer et initialiser l'objet arguments en fonction des paramètres de la fonction, et donner des arguments L'objet ajoute des attributs tels que "0", "1", "2" et "3", dont la valeur initiale n'est pas définie, et la valeur arguments.length est définie sur le nombre réel de paramètres transmis.

• 2. Recherchez la déclaration de fonction et ajoutez des attributs à l'objet variable. Le nom de l'attribut est le nom de la fonction et la valeur de l'attribut est la valeur de référence de la fonction. une avec le même nom, écrasez-la directement

• 3. Recherchez la déclaration de variable var (lors de la recherche d'une variable, les paramètres de la fonction seront équivalents à la déclaration var, donc la le même attribut que le nom du paramètre sera également ajouté au VO, et la valeur initiale sera également ajoutée non définie), ajoutez un attribut à l'objet variable. Le nom de l'attribut est le nom de la variable et la valeur de l'attribut est indéfinie. déjà un identifiant du même nom, il ne sera pas traité

S'il existe un identifiant (fonction, variable) du même nom ), la fonction peut écraser la variable, et le la fonction a une priorité plus élevée que la variable

L'objet variable (OV) et l'objet d'activation (AO) sont la même chose, deux noms à des moments différents. On l'appelle l'objet variable pendant la période de création, et on l'appelle l'objet d'activation pendant la période d'exécution

Prenons le code suivant comme exemple

var g_name="tom";
var g_age=20;
function g_fn(num){
 var l_name="kity";
 var l_age=18;
 function l_fn(){
  console.log(g_name + '===' + l_name + '===' + num);
 }
}
g_fn(10);

Phase de compilation

Lorsque le contrôleur JS passe à ce morceau de code, un contexte d'exécution sera créé G_EC

La structure du contexte d'exécution est grossièrement. comme suit :

G_EC = {
 VO   : {},
 Scope_chain : [],
 this  : {}
}

/* VO的结构大概 */
VO = {
 g_name : undefined,
 g_age : undefined,
 g_fn : <函数在内存中引用值>
}

/* Scope_chain的大概结构如下 */
Scope_chain = [ G_EC.VO ] // 数组中第一个元素是当前执行上下文的VO，第二个是父执行上下文的VO,最后一个是全局执行上下文的VO,在执行阶段，会沿着这个作用域链一个一个的查找标识符，如果查到则返回，否知一直查找到全局执行上下文的VO

/* this */
this = undefined // 此时this的值是undefined

Une fois le contexte d'exécution créé, il est immédiatement poussé dans la pile d'appels de fonction. À ce moment, l'interpréteur le fera tranquillement. une chose, qui est d'ajouter un attribut interne [[portée à la fonction dans le VO actuel]], cet attribut pointe vers la chaîne de portée ci-dessus.

g_fn.scope = [ global_EC.VO ] // 该scope属性只能被JS解释器所使用，用户无法使用

Phase d'exécution

Exécuter le code ligne par ligne Lorsqu'une expression est rencontrée, elle ira à la chaîne de portée actuelle. . Recherchez l'objet VO dans l'objet et revenez s'il est trouvé. S'il n'est pas trouvé, continuez à rechercher l'objet VO suivant jusqu'à ce que l'objet VO global soit terminé.

À ce stade, il peut y avoir une affectation de variable, un appel de fonction et d'autres opérations. Lorsque l'interpréteur rencontre g_fn(), il sait qu'il s'agit d'un appel de fonction, puis crée immédiatement un contexte d'exécution de fonction. pour cela, fn_EC , le contexte fn_EC comporte également deux phases

, qui sont la phase de création et la phase d'exécution.

Dans la phase de création, pour le contexte d'exécution de la fonction, lors de la création de l'objet variable, un objet arguments supplémentaire sera créé, puis des attributs seront ajoutés à l'objet arguments : "0", "1", "2" dont la valeur initiale n'est pas définie,

• Rechercher la déclaration de fonction de fonction

• Rechercher la déclaration de variable var

Ce qui précède est ce que j'ai compilé pour tout le monde, j'espère que cela sera utile à tout le monde à l'avenir.

Articles associés :

p5.jsImplémentation de l'animation en spirale d'or

Délégation d'événements en JS Explication détaillée de l'utilisation des méthodes calculées et dans Vue.js

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!