Maison > interface Web > js tutoriel > Pourquoi ma variable globale n'est-elle pas définie en JavaScript ?

Pourquoi ma variable globale n'est-elle pas définie en JavaScript ?

Barbara Streisand
Libérer: 2024-12-07 17:06:12
original
553 Les gens l'ont consulté

Why is My Global Variable Undefined in JavaScript?

Surpris qu'une variable globale ait une valeur non définie en JavaScript ?

Avez-vous déjà rencontré une situation dans laquelle une variable globale renvoie de manière inattendue une valeur non définie en JavaScript ? Considérez cet exemple déroutant :

var value = 10;

function test() {
    //A
    console.log(value);
    var value = 20;

    //B
    console.log(value);
}

test();
Copier après la connexion

Le résultat de ce code en surprend beaucoup :

undefined
20
Copier après la connexion

Pourquoi la variable globale n'est pas définie

Le La cause première de ce casse-tête réside dans un concept fondamental de JavaScript connu sous le nom de levage variable. Lorsque le moteur JavaScript interprète le code, il analyse initialement l'intégralité du bloc de code et « hisse » toutes les déclarations de variables vers le haut. Cependant, seules les déclarations sont levées, pas l'affectation.

Dans l'exemple ci-dessus, lorsque la fonction test est exécutée, la valeur de la variable globale n'est accessible à aucun moment. Au lieu de cela, une nouvelle valeur de variable locale est déclarée et attribuée. Cette variable locale masque la variable globale, ce qui entraîne une valeur non définie pour l'appel console.log(value) au point A.

Explication

Pour illustrer cela davantage, Réécrivons le code comme si le levage avait eu lieu :

// Variable declarations hoisted to the top of the function
var value = undefined;
var value = 20;

function test() {
    //A
    console.log(value);

    //B
    console.log(value);
}
Copier après la connexion

Maintenant, il est clair pourquoi le premier appel console.log renvoie undefined. La valeur de la variable locale n'a pas encore été attribuée.

Un autre exemple

Pour souligner le concept de levage, considérons le code suivant :

var test = 'start';

function end() {
    test = 'end';
    var test = 'local';
}

end();
alert(test);
Copier après la connexion

Ce code alerte sur la valeur « début », et non « fin » ou « local ». En effet, la variable test a été hissée au sommet de la fonction de fin, ombrageant ainsi la variable globale.

Les fonctions sont également hissées

Le levage s'applique non seulement aux variables, mais aussi aux fonctions. Le code suivant illustre ceci :

test("Won't work!");

test = function(text) { alert(text); }
Copier après la connexion

Ce code génère une erreur de référence car lorsque test("Won't work!") est appelé, la variable de test a été déclarée mais la fonction n'a pas été affectée. Seule une syntaxe de déclaration de fonction appropriée garantit un levage complet.

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!

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
Derniers articles par auteur
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal