E.. LE.. VA.. TION…

<script src=”other pages” title=”e\.{2}le\.{2}va\.{2}tion\.{3}”>

Ehm, si. Mucho mola esta rola peeero… No voy a hablar de ellos… 😛

Javascript, así como todos los lenguajes de programación tiene sus curiosidades. Acá no son pocas las que se “elevan“, más si hablamos de un lenguaje de script, débilmente tipado y basado en prototipos.

Hoisting o Elevación

¿Cuál será el valor de la variable b si ejecutamos el siguiente código?

var b = 1;
function a(){
    var b = 10;
    return;
}
a();
console.log(b);

Si respondiste que el valor es 10, no hiciste bien tu tarea 😛 ¡Intenta de nuevo! El valor es 1

Ahora una leve modificación. Adivina cual será el valor de la variable b

var b = 1;
function a(){
    b = 10;
    return;
}
a();
console.log(b);

Si piensas que la respuesta es 1, debes estudiar más 😛 . ¡Piensa de nuevo! La respuesta es 10

En Javascript, como en [casi] todos los lenguajes de programación, existe un alcance global y pueden existir múltiples alcances locales. Sin embargo, Javascript tiene la peculiaridad de “elevar” la declaración de variables al contexto superior más inmediato. Existen 4 contextos:

  • De función: todo lo que se encuentra dentro de la sentencia function(){ ... }.
  • De declaración: sólo existe en el script cuando se declara una variable con la sentencia var antes de declarar cualquier otra función.
  • De condición: cuando se declaran variables dentro de condicionales if(){ ... }.
  • De espacio de nombre: cuando se declaran variables o funciones con la sentencia var dentro del prototipado de un objeto, como var objeto = {valor: function(){ ... } };.

El hoisting es una característica bastante peculiar, pues sólo se da en casos en los que un contexto de declaración pretende modificar un contexto de función o viceversa. En ambos casos, la declaración será global.

En el primer ejemplo, el contexto de función intenta modificar la variable en el contexto de declaración, esto es, cada vez que es interpretada la sentencia var, ésta incluye una variable dentro del contexto en el que es instanciado, dicho proceso ocurre una sola vez dentro de todo el script. La variable b no cambia su valor porque un contexto inferior intenta cambiarlo (entiéndase por inferior el hecho de estar en un “bloque” inferior, o debajo de la declaración).

En el segundo ejemplo ocurre lo mismo, solo que en vez de intentar modificar el valor de la variable en el contexto de función, lo “eleva” al contexto de declaración, modificando así su valor.

Esto es un bug que pareciera intencional dentro del lenguaje, sin embargo, se recomienda evitarlo en aplicaciones que tengan uso masivo de Javascript, ya que puede resultar en comportamientos impredecibles.

Con respecto a la forma de manejar los tipos de alcance para evitar el hoisting, el estandar ECMAScript 5.1:

Si la declaración de variables se produce dentro de una declaración de una función, las variables se definen con ámbito de función local en esa función, tal como se describe en la sección 10.1.3.. De lo contrario, se definen con alcance global (es decir, que se crean como miembros del objeto global, tal como se describe en la sección 10.1.3), atribuyendo el uso de la propiedad DontDelete. Las variables se crean cuando se entra en el ámbito de ejecución, pero un bloque no define un nuevo ámbito de ejecución. Sólo el programa y la declaración de funciones producen un nuevo ámbito.

Y ya con esto, me “elevo”… 😉

</script>

Anuncios

Un comentario en “E.. LE.. VA.. TION…

Los comentarios están cerrados.