JavaScript lyftning förklaras

Dagens video-snabbtips kommer som svar på en fråga på Twitter, angående JavaScript "hissning." Vad är det? Hur fungerar det? Vad behöver du veta om det? Allt detta kommer att bli täckt i den här nybörjargränssnittet.


Full Screencast



Hissförklarade

Tänk på följande kod:

 var myvar = "mitt värde"; alert (myVar); // mitt värde

Okej, naturligtvis kommer alerten att visa "mitt värde". Det är uppenbart; håll dig dock med mig. Låt oss nu skapa en omedelbar funktion som varnar samma värde.

 var myvar = "mitt värde"; (funktion () alert (myvar); // mitt värde) ();

Okej okej. Fortfarande uppenbart vet jag. Låt oss nu kasta en skiftnyckel i mixen och skapa en lokal variabel inom denna anonyma funktion med samma namn.

 var myvar = "mitt värde"; (funktion () alert (myvar); // undefined var myvar = "lokalt värde";) ();

Va? Varför visas varningen nu odefinierad? Även om vi har deklarerade en ny variabel, den är fortfarande under varningen; så det borde inte ha någon effekt, rätt? Fel.


Variabeldeklarationer lyftas

Inom dess nuvarande räckvidd, oavsett varför en variabel deklareras, kommer den bakom kulisserna att hissas till toppen. Men endast deklaration kommer att hissas. Om variabeln är också initialiseras, det nuvarande värdet, högst upp i räckvidden, kommer initialt att ställas in på odefinierad.

Okej, låt oss dechiffrera skillnaden mellan villkoren, deklaration och initiering. Antag följande rad: var joe = "rörmokare";

Deklaration
 var joe; // deklarationen
initiering
 joe = "rörmokare"; // initialiseringen

Nu när vi förstår terminologin kan vi lättare förstå vad som händer under huven. Tänk på följande falska funktion.

 (funktion () var a = 'a'; // kodkod var b = 'b'; // fler kodkod var c = 'c'; // antipattern // sista skriptlinjer) ;

Förklara alla variabler längst upp.

Observera att vad som exemplifieras ovan anses vara dålig praxis. Men bakom kulisserna kommer alla dessa variabla deklarationer - oavsett var de förekommer i funktionsomfånget - att hissas till toppen, som så:

 (funktion () var a, b, c; // variabler deklarerade a = 'a'; // kodkod b = 'b'; // initialiserat // fler kodkod c = 'c'; // initialiserade // sista skriptlinjerna) ();

Aha Moment

Om vi ​​nu återvänder till originalet förvirrar odefinierad kodstycke, ovanifrån:

 var myvar = "mitt värde"; (funktion () alert (myvar); // undefined var myvar = "lokalt värde";) ();

Det borde nu göra perfekt mening varför myvar är uppmärksam odefinierad. Som vi lärde oss, så snart som den lokala variabeln, myvar, förklarades, det lyftes automatiskt till toppen av funktionsomfånget ... ovanför varningen. Som ett resultat var variabeln redan deklarerad vid tidpunkten för varningen. men eftersom initialiseringar inte hissas också är värdet av variabeln: odefinierad.