Los últimos tutoriales de desarrollo web
 

JavaScript Hoisting


Hoisting es el comportamiento predeterminado del movimiento de JavaScript declaraciones a la cima.


Declaraciones de JavaScript se izan

En JavaScript, una variable puede declararse después de que haya sido utilizado.

En otras palabras; una variable puede ser utilizado antes de que haya sido declarada.

Ejemplo 1 da el mismo resultado que en el Ejemplo 2:

Ejemplo 1

x = 5; // Assign 5 to x

elem = document.getElementById("demo"); // Find an element
elem.innerHTML = x;                     // Display x in the element

var x; // Declare x
Inténtalo tú mismo "

Ejemplo 2

var x; // Declare x
x = 5; // Assign 5 to x

elem = document.getElementById("demo"); // Find an element
elem.innerHTML = x;                     // Display x in the element
Inténtalo tú mismo "

Para entender esto, hay que entender el término "hoisting" .

Hoisting es el comportamiento predeterminado de JavaScript de mover todas las declaraciones de la parte superior del ámbito actual (en la parte superior de la secuencia de comandos actual o la función actual).


JavaScript Inicializaciones No se izan

JavaScript única iza declaraciones, no inicializaciones.

Ejemplo 1 no da el mismo resultado que en el Ejemplo 2:

Ejemplo 1

var x = 5; // Initialize x
var y = 7; // Initialize y

elem = document.getElementById("demo"); // Find an element
elem.innerHTML = x + " " + y;           // Display x and y
Inténtalo tú mismo "

Ejemplo 2

var x = 5; // Initialize x

elem = document.getElementById("demo"); // Find an element
elem.innerHTML = x + " " + y;           // Display x and y

var y = 7; // Initialize y
Inténtalo tú mismo "

¿Tiene sentido que y no está definida en el último ejemplo?

Esto es debido a que sólo la declaración (var y), no la inicialización (= 7) se iza a la parte superior.

Debido a hoisting , y se ha declarado antes de que se utiliza, pero debido a las inicializaciones no se izan, el valor de Y es indefinido.

Ejemplo 2 es el mismo que la escritura:

Ejemplo

var x = 5; // Initialize x
var y;     // Declare y

elem = document.getElementById("demo"); // Find an element
elem.innerHTML = x + " " + y;           // Display x and y

y = 7;    // Assign 7 to y
Inténtalo tú mismo "

Declarar las variables en la cima!

Hoisting es (a muchos desarrolladores) un comportamiento desconocido o pasado por alto de JavaScript.

Si un desarrollador no entiende hoisting , los programas pueden contener bugs (errores).

Para evitar errores, declarar siempre todas las variables al comienzo de cada ámbito de aplicación.

Dado que esta es la forma en JavaScript interpreta el código, siempre es una buena regla.

JavaScript en modo estricto no permite que las variables que deben utilizarse si no se declaran.
Estudio "use strict" en el capítulo siguiente.