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!

<< Scopes en JavaScript Coerción en JavaScript >>