Surpris que la variable globale a pas défini la valeur en JavaScript
Aujourd'hui, je suis totalement surpris quand j'ai vu qu'une variable globale a undefined
valeur dans certains cas.
Exemple:
var value = 10;
function test() {
//A
console.log(value);
var value = 20;
//B
console.log(value);
}
test();
Donne en sortie
undefined
20
Ici, pourquoi est le moteur JavaScript, compte tenu de valeur mondiales comme undefined
. Je sais que le JavaScript est un langage interprété. Comment est-il en mesure de considérer des variables dans la fonction?
Est qu'un piège à partir du moteur JavaScript?
Vous devez vous connecter pour publier un commentaire.
Ce phénomène est connu sous le nom: Variable JavaScript de Levage.
À aucun moment, êtes-vous accéder à la variable globale dans votre fonction, vous n'avez accès au local
value
variable.Votre code est équivalente à la suivante:
Toujours surpris que vous obtenez
undefined
?Explication:
C'est quelque chose que tous les programmeurs JavaScript heurte tôt ou tard. Tout simplement, ce que vous déclarez des variables sont toujours hissé vers le haut de votre fermeture. Donc, même si vous avez déclaré votre variable après la première
console.log
appel, il est toujours considéré comme si vous aviez déclaré avant que.Toutefois, seule la partie de déclaration est hissée; la cession, en revanche, ne l'est pas.
Donc, quand vous d'abord appelé
console.log(value)
, vous avez été le référencement de votre déclarés localement variable, qui n'a rien affecté à encore; doncundefined
.Voici un autre exemple:
Que pensez-vous de cette alerte? Non, ne pas seulement lire, réfléchir à ce sujet. Quelle est la valeur de
test
?Si vous dit rien d'autre que
start
, vous vous trompiez. Le code ci-dessus est équivalent à ceci:de sorte que la variable globale n'est jamais affectée.
Comme vous pouvez le voir, peu importe où vous placez votre déclaration de variable, il est toujours hissé vers le haut de votre fermeture.
Note de côté:
Ceci s'applique également aux fonctions.
Envisager ce morceau de code:
qui vous donnera une erreur de référence:
Ce qui perturbe beaucoup de développeurs, depuis ce morceau de code fonctionne très bien:
La raison en est, comme indiqué, est parce que la cession de la partie est pas hissé. Ainsi, dans le premier exemple, lorsque
test("Won't work!")
a été exécuté, latest
variable a déjà été déclaré, mais doit encore avoir la fonction qui lui est assignée.Dans le deuxième exemple, nous ne sommes pas à l'aide de l'attribution de la variable. Plutôt, nous sommes en utilisant une fonction syntaxe de déclaration, qui ne obtenir la fonction complètement levé.
Ben Cerise a écrit un excellent article sur ce, à juste titre,JavaScript délimitation de l'étendue et de Levage.
La lire. Il va vous donner la totalité de l'image en détail.
J'ai été un peu déçu que le problème ici est expliqué, mais personne n'a proposé une solution. Si vous souhaitez accéder à une variable globale dans le domaine de la fonction sans fonction de faire un pas défini local var tout d'abord, la référence de la var comme
window.varName
Variables en JavaScript toujours avoir une fonction à l'échelle de la portée. Même si elles ont été définies au moyen de la fonction, ils sont visibles avant. Un phénomène similaire peut être observé avec fonction de levage.
Cela étant dit, la première
console.log(value)
voit levalue
variable (à l'intérieur de laquelle les ombres de l'extérieurvalue
), mais il n'a pas encore été initialisé. Vous pouvez y penser comme si toutes les déclarations de variables sont implicitement déménagé au début de la fonction (pas le plus intérieur du bloc de code), tandis que les définitions sont laissés sur le même lieu.Voir aussi
Il y est une variable globale
value
, mais lorsque le contrôle entre lestest
fonction, un autrevalue
variable est déclarée, qui masque la mondiale. Depuis les déclarations de variables (mais pas les affectations de) en JavaScript sont hissés au sommet de la portée dans laquelle elles sont déclarées:Noter que le même est vrai pour les déclarations de fonction, ce qui signifie que vous pouvez appeler une fonction avant qu'elle semble être définis dans votre code:
Il est également intéressant de noter que lorsque vous combinez les deux dans une expression de fonction, la variable sera
undefined
jusqu'à ce que la cession a lieu, de sorte que vous ne pouvez pas appeler la fonction jusqu'à ce qu'il se passe:La façon la plus simple de garder l'accès à l'extérieur variables (et pas seulement de portée mondiale) est, bien sûr, à essayer de ne pas re-déclarer sous le même nom dans les fonctions; il suffit de ne pas utiliser var là. L'utilisation de descriptif approprié les règles de nommage est conseillé. Avec celles-là, ça va être dur de se retrouver avec des variables nommées comme valeur (cet aspect n'est pas nécessairement liée à l'exemple de la question comme le nom de cette variable aurait été donnée pour des raisons de simplicité).
Si la fonction peut être réutilisé ailleurs et donc il n'y a aucune garantie que l'extérieur de la variable réellement définie dans ce nouveau contexte, Eval fonction peut être utilisée. Il est lent dans cette opération, de sorte qu'il n'est pas recommandé pour des performances exigeantes fonctions:
Si l'extérieur de la portée de la variable que vous voulez l'accès est défini dans une fonction nommée, alors il pourrait être attaché à la fonction elle-même en premier lieu et ensuite accessible à partir de n'importe où dans le code, qu'il s'agisse de profondément imbriqués les fonctions ou les gestionnaires d'événements en dehors de tout le reste. Notez que l'accès aux propriétés est beaucoup plus lent et vous obligerait à modifier la façon de programmer, de sorte qu'il n'est pas recommandé, sauf si c'est vraiment nécessaire: Les Variables comme des propriétés des fonctions (JSFiddle):