Hoisting en JavaScript

Introducción Link to heading

El hoisting es un comportamiento fundamental en JavaScript que afecta la forma en que se interpretan las variables y las funciones en el código.

Hoisting con variables Link to heading

• En versiones anteriores de JavaScript (antes de ECMAScript 6), las variables declaradas con var se “elevan” (hoistean) a la parte superior de su ámbito (función o global).
• Esto significa que puedes acceder a una variable declarada con var antes de su línea de declaración dentro del mismo ámbito.

Ejemplo Link to heading

console.log(myName); // Displays "undefined"

var myName; // It declares
myName = "John"; // It is initialized

// The variable can be accessed before its declaration

¿Qué sucede en realidad? Link to heading

• El intérprete de JavaScript crea la variable como undefined al inicio del ámbito.
• Cuando se ejecuta la línea console.log(myName), se imprime el valor actual de la variable, que es undefined.
• Posteriormente, se asigna el valor “John” a la variable myName.

Hoisting con funciones Link to heading

• Las funciones también se “elevan” al inicio del ámbito.
• Esto significa que puedes llamar a una función antes de su declaración dentro del mismo ámbito.

Ejemplo Link to heading

hey();

function hey() {
    console.log("Hello " + myName);
}

var myName = "John";

// The function can be called before its declaration

¿Qué sucede en realidad? Link to heading

• La función hey() se eleva al inicio del ámbito.
• Cuando se ejecuta la línea hey(), se busca la función y se ejecuta.
• La variable myName aún no está definida, por lo que se imprime “Hola undefined”.
• Posteriormente, se asigna el valor “John” a la variable myName.

Consideraciones importantes: Link to heading

• El hoisting puede ser útil en algunos casos, pero también puede generar errores y confusiones si no se comprende correctamente.
• Se recomienda usar let y const para declarar variables en lugar de var, ya que estas no se “elevan” y su alcance está mejor definido.
• Las funciones siempre se “elevan” al inicio del ámbito, independientemente de si se declaran con var, let o const.

En resumen Link to heading

• El hoisting es un comportamiento que “eleva” las variables y las funciones al inicio del ámbito.
• Es importante comprender cómo funciona el hoisting para evitar errores y confusiones en el código.
• Se recomienda usar let y const para declarar variables en lugar de var.

¡Sigue aprendiendo sobre hoisting para escribir código JavaScript más claro y eficiente!