Explicación de elevación de JavaScript

El consejo rápido del video de hoy responde a una pregunta en Twitter, sobre la "elevación" de JavaScript. ¿Qué es? ¿Como funciona? ¿Qué necesitas saber al respecto? Todo esto se tratará en esta lección de fundamentos centrada en el principiante..


Screencast completo



Levantamiento explicado

Considere el siguiente código:

 var myvar = 'mi valor'; alerta (myvar); // mi valor

Bien, por supuesto, la alerta mostrará "mi valor". Eso es obvio; sin embargo, quédate conmigo. A continuación creamos una función inmediata, que alerta el mismo valor..

 var myvar = 'mi valor'; (function () alert (myvar); // mi valor) ();

Bien, bien. Todavía obvio, lo sé. Ahora, echemos una llave a la mezcla y creamos una variable local dentro de esta función anónima del mismo nombre.

 var myvar = 'mi valor'; (function () alert (myvar); // undefined var myvar = 'valor local';) ();

Eh ¿Por qué se muestra la alerta ahora? indefinido? A pesar de que hemos declarado una nueva variable, todavía está por debajo de la alerta; Así que no debería tener un efecto, ¿verdad?? Incorrecto.


Declaraciones variables son izadas

Dentro de su alcance actual, independientemente de donde se declara una variable, será, detrás de escena, elevado a la parte superior. Sin embargo, sólo el declaración será levantado. Si la variable es también inicializado, el valor actual, en la parte superior del alcance, se establecerá inicialmente en indefinido.

Bien, vamos a descifrar la diferencia entre los términos., declaración y inicialización. Supongamos la siguiente línea: var joe = 'fontanero';

Declaración
 var joe; // la declaracion
Inicialización
 joe = 'fontanero'; // la inicialización

Ahora que entendemos la terminología, podemos comprender más fácilmente lo que sucede debajo del capó. Considere la siguiente función falsa.

 (function () var a = 'a'; // líneas de código var b = 'b'; // más líneas de código var c = 'c'; // antipattern // líneas finales de scripting) () ;

Declara todas las variables en la parte superior..

Tenga en cuenta que lo que se ejemplifica anteriormente se considera una mala práctica. No obstante, detrás de escena, todas esas declaraciones de variables, independientemente de dónde se encuentren en el ámbito de la función, se elevarán a la parte superior, de esta manera:

 (function () var a, b, c; // variables declaradas a = 'a'; // líneas de código b = 'b'; // inicializadas // más líneas de código c = 'c'; // inicializado // líneas finales de scripting) ();

Aha Momento

Si ahora volvemos al confuso original. indefinido pieza de código, desde arriba:

 var myvar = 'mi valor'; (function () alert (myvar); // undefined var myvar = 'valor local';) ();

Ahora debería tener perfecto sentido por qué Myvar está alertando indefinido. Como aprendimos, tan pronto como la variable local., Myvar, se declaró, se colocó automáticamente en la parte superior del alcance de la función ... por encima de la alerta. Como resultado, la variable ya había sido declarada en el momento de la alerta; sin embargo, debido a que las inicializaciones no se elevan también, el valor de la variable es: indefinido.