Maison > interface Web > js tutoriel > Analyse du comportement et des principes de levage de JavaScript

Analyse du comportement et des principes de levage de JavaScript

黄舟
Libérer: 2017-02-28 14:43:13
original
1001 Les gens l'ont consulté

Pour les élèves qui viennent d'apprendre JavaScript, certains de ses comportements peuvent vous rendre confus

Il est très différent du C/C que vous avez appris à l'école
Par exemple, c'est le cas

a = 1;var a;console.log(a);// 1
Copier après la connexion

Certains étudiants peuvent penser qu'il devrait être indéfini, car var a semble avoir été réaffecté à a
Dans ce cas

console.log(a);// undefinedvar a = 1;
Copier après la connexion

a n'a pas été déclaré pourtant Imprimez simplement, cela devrait être une erreur, ou référez-vous au comportement du navigateur ci-dessus et il devrait afficher 2
Cependant, le résultat n'est pas défini

La séquence de code que vous voyez n'est pas nécessairement le vrai js moteur L'ordre d'exécution
C'est le comportement d'amélioration de JavaScript dont je veux parler aujourd'hui
En fait, écrire cet article consiste à compléter les connaissances de pré-compilation
Si vous ne connaissez pas la pré-compilation avant de lire, cliquez ci-dessous
Précompilation JavaScript
La précompilation de JavaScript conduit directement à son comportement de promotion

Comportement de promotion

En fait, en comprenant la précompilation, on peut clairement comprendre pourquoi
la précompilation a lieu avant l'exécution. Compilez
donc exécuter ces deux blocs de code équivaut à exécuter du code comme celui-ci

var a;a = 1;console.log(a);// 1
Copier après la connexion
var a;console.log(a);// undefineda = 1;
Copier après la connexion

Pour ce comportement de promotion, rappelez-vous ces deux phrases
Promotion de la déclaration de variable , la déclaration globale de la fonction est améliorée
Encore une fois,

function demo(){….}这才叫做函数声明 
var demo = function(){….}这不叫函数声明
Copier après la connexion

En fait, tant que vous comprenez le principe de précompilation, le comportement de promotion est facile à comprendre

Nous avons l'habitude de traiter var a = 1 C'est considéré comme une déclaration
, mais le moteur js ne le pense pas. Il le divisera en var = a déclaration et a = 1 initialisation
. . La première est une tâche en phase de compilation, et la seconde est en phase d'exécution. Tâche
Donc, peu importe où votre déclaration apparaît dans le scope, elle sera traitée à l'avance avant l'exécution
C'est. équivalent à déplacer la déclaration de variable et la déclaration de fonction vers le haut de la portée
Ce processus s'appelle amélioration

Nous ne devons jamais déclarer de variables répétées lors de la programmation, encore moins déclarer des fonctions et variables ordinaires avec le même nom
Au fait, les variables C'est une bonne habitude d'utiliser une déclaration var en haut de la portée (principe d'une seule var)
De cette façon, vous n'avez pas à vous soucier comportement de promotion

Exemple d'analyse

Même ainsi, nous devons encore comprendre ce processus , c'est aussi au centre des questions d'entretien
Prenons un exemple à l'ancienne et jetons un coup d'œil

function a(a, b){
    console.log(a);    console.log(c);
    c = 0;    console.log(b);
    var c;
    a = 3;
    b = 2;    console.log(a);    console.log(c);    console.log(b);    function b(){};
    console.log(b);
}
a(1);
Copier après la connexion

Je ne sais pas si vous êtes confus, il y a un tas d'abc
La bonne réponse est :

1   undefined    function b(){}    3    0    2    2
Copier après la connexion

Analysons-le à partir de la précompilation d'abord, et examinez-le en passant

  1. Créer un objet AO (Active Object)

  2. Recherchez les paramètres formels de fonction et les déclarations de variables dans la fonction. Les noms de paramètres formels et les noms de variables sont utilisés comme attributs de l'objet AO. La valeur est indéfinie

  3. Les paramètres réels et les paramètres formels sont unifiés, et les valeurs réelles des paramètres. Attribuez au paramètre formel

  4. pour trouver la déclaration de fonction, le nom de la fonction est utilisé comme attribut de l'objet AO et la valeur est la référence de la fonction

généré avant l'exécution de la dernière fonction a L'objet AO ressemble à ceci

//伪代码AO->{
    a: 1
    b: function(){}
    c: undefined}
Copier après la connexion

, cela équivaut donc à exécuter une telle fonction
(le nom de la fonction a n'est pas en conflit avec les variables à l'intérieur)

function a(){    var a = 1;    var b = function(){};    var c;

    console.log(a);//1
    console.log(c);//undefined
    c = 0;
    console.log(b);//function(){}
    a = 3;
    b = 2;
    console.log(a);//3
    console.log(c);//0
    console.log(b);//2
    console.log(b);//2}
Copier après la connexion

Nous sommes donc très Nous avons la réponse facilement

S'il y a une déclaration de variable et une déclaration de fonction du même nom
La déclaration de fonction doit remplacer la déclaration de variable (les fonctions JavaScript sont les premiers citoyens avec divers privilèges)
Si une déclaration de variable ayant le même nom qu'une autre déclaration de variable
ou une déclaration de fonction ayant le même nom qu'une autre déclaration de fonction
C'est qui a la priorité sous le document

Résumé

Ce qui précède est ce que j'ai partagé avec vous aujourd'hui. Le comportement de promotion JavaScript
est résumé en deux phrases : Promotion de déclaration de variable, promotion de déclaration de fonction globale
En fait, c'est un comportement inévitable causé par la pré-compilation du moteur js

Ce qui précède est JavaScript. Le comportement d'amélioration et le contenu de l'analyse des principes, veuillez faire attention au site Web PHP chinois (www.php .cn) pour plus de contenu connexe !


Étiquettes associées:
source:php.cn
Déclaration de ce site Web
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
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal