Maison  >  Article  >  interface Web  >  Explication détaillée du fonctionnement de JavaScript

Explication détaillée du fonctionnement de JavaScript

小云云
小云云original
2018-02-11 09:31:533859parcourir

Cet article vous donne principalement une analyse théorique détaillée des principes de fonctionnement de JavaScript et le partage de points de connaissances. Si cela vous intéresse, n'hésitez pas à 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é et différent des autres langages de programmation, tels que les langages compilés​​. Comme Java/C++, ces langages seront entièrement compilés avant l'exécution du code, et d'abord compilés 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 3f1c4e4b6b16bbbd69b2ee476dc4f83axxx2cacc6d41bbb37262a98f745aa00fbf0 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)

  • 1. 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 du même nom (fonction, variable ), la fonction peut écraser la variable, et 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 l'objet d'activation pendant la période d'exécution

Prenons comme exemple le code suivant


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);
Compilation phase

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


est à peu près la suivante :


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à, l'interpréteur fera tranquillement une chose, qui consiste à ajouter un attribut interne. [[scope]] à la fonction dans le VO actuel, qui 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, VO sera recherché dans la chaîne de portée actuelle Objet, s'il est trouvé, il est renvoyé. S'il n'est pas trouvé, il continue de rechercher l'objet VO suivant jusqu'à ce que l'objet VO global se termine.


À 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,

  • Trouver la déclaration de fonction de fonction

  • Trouver la déclaration de variable var

Recommandations associées :

Analyse d'un exemple de code du mécanisme d'exécution JavaScript

Cette introduction détaillée au mécanisme d'exécution JavaScript_Connaissances de base

Événements du mécanisme d'exécution de JavaScript Explication détaillée des compétences Loop (Event Loop)_javascript

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!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn