JavaScript Hoisting Explained

Sfatul video rapid de astăzi vine ca răspuns la o întrebare pe Twitter, referitoare la "ridicarea" JavaScript. Ce este? Cum functioneazã? Ce trebuie să știți despre asta? Toate acestea vor fi acoperite de această lecție fundamentală concentrată pe începători.


Full Screencast



Ridicarea explicată

Luați în considerare următorul cod:

 var myvar = 'valoarea mea'; alert (myvar); // valoarea mea

Bineînțeles, alerta va afișa "valoarea mea". E evidentă; totuși, rămâi cu mine. Să creați în continuare o funcție imediată, care avertizează aceeași valoare.

 var myvar = 'valoarea mea'; (funcția () alert (myvar); // valoarea mea) ();

Bine, bine. Încă evident, știu. Acum, hai să aruncăm o cheie în amestec și să creăm o variabilă locală în cadrul acestei funcții anonime cu același nume.

 var myvar = 'valoarea mea'; (funcția () alert (myvar); // undefined var myvar = 'valoare locală';) ();

Nu-i asa? De ce este afișată acum alerta nedefinit? Chiar dacă am declarat o nouă variabilă, este încă sub avertisment; așa că nu ar trebui să aibă un efect, corect? Gresit.


Declarațiile variabile sunt ridicate

În cadrul domeniului său de aplicare actual, indiferent de locul în care este declarată o variabilă, va fi, în spatele scenei, ridicată în partea de sus. Cu toate acestea, numai declaraţie vor fi ridicate. Dacă variabila este, de asemenea inițializat, valoarea inițială, în partea de sus a domeniului de aplicare, va fi inițial setată la nedefinit.

Bine, să descifrăm diferența dintre termeni, declaraţie și iniţializarea. Să presupunem următoarea linie: var joe = "instalator";

Declaraţie
 var joe; // declarația
Inițializarea
 joe = "instalator"; // inițializarea

Acum, când înțelegem terminologia, putem înțelege mai ușor ce se întâmplă sub capotă. Luați în considerare următoarea funcție falsă.

 () () var a = 'a'; // linii de cod var b = 'b'; // mai multe rânduri de cod var c = 'c'; // antipattern // linii finale de scripting ;

Declarați toate variabilele din partea de sus.

Rețineți că exemplele de mai sus sunt considerate a fi o practică nepotrivită. Cu toate acestea, în spatele scenei, toate declarațiile variabile - indiferent de locul în care se află în domeniul de funcții - vor fi ridicate la vârf, după cum urmează:

 (funcția () var a, b, c; // variabile declarate a = 'a'; // linii de cod b = 'b'; // inițializate // mai multe linii de cod c = 'c'; inițializate // linii finale de scripting) ();

Aha Moment

Dacă vom reveni la confuzia originală nedefinit bucată de cod, de sus:

 var myvar = 'valoarea mea'; (funcția () alert (myvar); // undefined var myvar = 'valoare locală';) ();

Ar trebui acum să înțelegeți de ce myVar avertizează nedefinit. După cum am aflat, de îndată ce variabila locală, myVar, a fost declarată, a fost ridicată automat în partea superioară a domeniului funcției ... deasupra alertei. Drept urmare, variabila a fost deja declarată la momentul alertei; totuși, deoarece inițializările nu sunt ridicate, valoarea variabilei este: nedefinit.

Cod