web-dev-qa-db-fra.com

«Levage» de JavaScript

Je suis tombé sur le "levage" de JavaScript et je n'ai pas compris comment cet extrait de code fonctionne vraiment:

var a = 1;

function b() {
    a = 10;
    return;

    function a() {}
}

b();
alert(a);

Je sais que la déclaration de fonction comme (function a() {}) va être hissée en haut de la portée de la fonction b mais elle ne doit pas remplacer la valeur de a (car la fonction les déclarations remplacent les déclarations de variables mais pas l'initialisation des variables) donc je m'attendais à ce que la valeur de l'alerte soit 10 au lieu de 1 !!

javascripthoisting
82
morfioce
  1. Le paramètre global a est défini sur 1
  2. b() est appelée
  3. function a() {} est hissée et crée une variable localea qui masque le global a
  4. Le a local est défini sur 10 (Écrasement de la fonction a)
  5. Le global a (toujours 1) Est alerté
113
Quentin

C'est parce que l'ordre de compilation/interprétation dans cet exemple est quelque peu trompeur. La ligne function a () {} est interprétée avant l'exécution du reste de la fonction, donc au tout début de la fonction, a a la valeur de function a () {}. Lorsque vous le réaffectez à 10, Vous réaffectez la valeur de a dans la portée locale de la fonction b(), qui est ensuite supprimée une fois que vous revenez, en laissant la valeur d'origine de a = 1 dans la portée globale.

Vous pouvez le vérifier en plaçant alert() ou similaire aux endroits appropriés pour voir quelle est la valeur de a à différents points.

6
fraveydank

(1) JavaScript n'a pas de portée d'instruction de bloc; il sera plutôt local au code dans lequel réside le bloc.

(2) Déclaration de variables de Javascript dans une portée de fonction, ce qui signifie que les variables déclarées dans une fonction sont disponibles n'importe où dans cette fonction, avant même qu'une valeur leur soit affectée = .

(3) Dans le corps d'une fonction, une variable locale a priorité sur une variable globale du même nom. Si vous déclarez une variable locale ou un paramètre de fonction avec le même nom qu'une variable globale, vous cachez effectivement la variable globale.

votre code est le même que: ( lire le commentaire)

<script>
var a = 1;          //global a = 1
function b() {
    a = 10;         
    var a = 20;     //local a = 20
}
b();
alert(a);           //global a  = 1
</script>

référence:
(1) Portée variable JavaScript:
(2) Un exemple dangereux de levage Javascript
(3) Portée variable

Donc dans votre code:

var a = 1;          //global a = 1  
function b() {
    a = 10;         
    return;
    function a() {} //local 
}
b();
alert(a);           //global a = 1
5
Grijesh Chauhan
  1. la déclaration de fonction function a(){} est hissée en premier, donc dans la portée locale a est créée.
  2. Si vous avez deux variables de même nom (une globale et une locale), la variable locale a toujours la priorité sur la variable globale.
  3. Lorsque vous définissez a=10, vous définissez la variable locale a, pas la variable globale.

Par conséquent, la valeur de la variable globale reste la même et vous obtenez, alerté 1

2
Jhankar Mahbub

Quand j'ai lu le même article que vous avez lu JavaScript Scoping and Hoisting , j'étais également confus parce que l'auteur n'a jamais montré ce que les deux exemples de codes d'ouverture sont interprétés comme dans le compilateur.

Voici l'exemple que vous avez fourni, et le second sur la page:

var a = 1;
function b() {
    function a() {} // declares 'a' as a function, which is always local
    a = 10;
    return;
}
b();
alert(a);

et voici le premier exemple sur la page:

var foo = 1;
function bar() {
    var foo; // a new local 'foo' variable
    if (!foo) {
        foo = 10;
    }
    alert(foo);
}
bar();

J'espère que cela t'aides

0
Jonathan