Lectores como tú ayudan a apoyar a MUO. Cuando realiza una compra utilizando enlaces en nuestro sitio, podemos ganar una comisión de afiliado.
Hoisting es un mecanismo de JavaScript que le permite acceder a variables y funciones antes de inicializarlas. Levantar tal declaración efectivamente la lleva a la parte superior de su alcance.
Aprenda todo sobre cómo funciona el levantamiento en JavaScript y cómo administrarlo mejor para evitar errores en su código.
Elevación de variables con var, let y const
La elevación es posible porque JavaScript usa el sistema de compilación JIT (Just-in-Time), que escanea su código para identificar todas las variables en sus respectivos ámbitos.
Luego, el compilador JIT eleva todas las instancias de declaraciones de variables a la parte superior de su alcance durante la compilación. JavaScript solo levanta declaraciones de variables, no sus inicializaciones.
El comportamiento de las variables, cuando se elevan, depende de la palabra clave con la que las declares, ya que cada palabra clave se comporta de manera diferente.
variable
Acceder a una variable no inicializada declarada con el variable la palabra clave regresará indefinido. Por ejemplo:
consola.log (foo); // indefinido
variable foo = 2;
El código anterior registra indefinido porque llama consola.log antes de inicializar la variable.
El compilador de JavaScript ve el bloque de código anterior así:
variable foo;
consola.log (foo); // indefinido
fo = 2;
Durante la elevación, las variables obedecen a la reglas de alcance de JavaScript. Javascript solo elevará una variable a la parte superior del alcance en el que la declaró. Intentar registrar el valor de una variable fuera de su alcance declarado resultará en una Error de referencia. Por ejemplo, si declara una variable dentro de una función, no será visible fuera de ese ámbito:
funciónmifunción() {
consola.log (foo); // indefinido
variable foo = 10;
}
miFuncion();
consola.log (foo); // ReferenceError: foo no está definido
Intentar acceder a una variable fuera de su alcance resultará en una Error de referencia.
let y const
De acuerdo con la MDN documentación sobre dejar y constante elevación, JavaScript también levanta variables declaradas con el dejar y constante palabras clave Sin embargo, a diferencia de las variables declaradas con el variable palabra clave, no se inicializan con una indefinido valor.
Por ejemplo:
funciónmifunción() {
consola.log (foo); // indefinido
consola.log (barra); // ReferenceError: No se puede acceder a la 'barra' antes de la inicialización
consola.registro (baz); // ReferenceError: No se puede acceder a 'baz' antes de la inicializaciónvariable foo = 5;
dejar barra = 10;
constante baz = 15;
}
miFuncion();
No puede acceder a las variables declaradas con las palabras clave let y const antes de inicializarlas con un valor.
Funciones de elevación
JavaScript eleva funciones de manera similar a las variables. Al igual que con las variables, depende de cómo las declares. Por ejemplo, JavaScript eleva las declaraciones de funciones de forma diferente a las expresiones de funciones.
Una declaración de función es una función declarada con un nombre, mientras que una expresión de función es una función cuyo nombre puede omitir. Por ejemplo:
funciónFoo() {
// declaración de función
}
constante barra = () => {
// expresión de la función
}
JavaScript levanta declaraciones de funciones pero no expresiones de funciones. Por ejemplo:
foo(); // 5
bar(); // TypeError: bar() no es una función// Declaración de función
funciónFoo() {
consola.registro(5);
}
// Expresión de función
variable barra = funciónexpresión() {
consola.registro(10);
};
Este código llama Foo antes de declararlo e inicializarlo como una función, pero aún registra 5 a la consola Sin embargo, tratando de llamar bar resulta en un Error de tecleado.
Gestión de elevación
Estar al tanto de la elevación y de los posibles errores que podrían ocurrir si se gestiona incorrectamente puede ahorrarle largas horas de depuración. Aquí hay algunas formas en que puede administrar el izaje.
Declarar variables dentro de funciones
Declarar variables dentro de las funciones que accederán a ellas. No siempre podrá hacer esto, ya que es posible que necesite una variable global a la que pueda acceder dentro de múltiples funciones. Así que asegúrese de declarar variables globalmente solo si realmente lo necesita.
Declarar variables con let o const
Siempre debes usar la let y Const palabras clave en lugar de variable palabra clave al declarar variables. Esta práctica es beneficiosa cuando se declaran variables locales dentro de una función. Conocer las formas correctas de declarar variables en JavaScript reduce las posibilidades de que se produzcan errores causados por el levantamiento en su código.
Declarar variables en la parte superior de su alcance
Declare todas sus variables en la parte superior de sus respectivos ámbitos, antes de cualquier otra declaración. Si lo hace, se asegurará de que el compilador de JavaScript no tenga que elevar esas variables para acceder a ellas.
Uso del modo estricto
El modo estricto es un modo de JavaScript que regula la sintaxis deficiente, optimiza el tiempo de ejecución de su código y prohíbe el abuso de la sintaxis poco tipeada de JavaScript al arrojar errores en tiempo de compilación.
Por ejemplo, en "modo descuidado", debido a la elevación, puede acceder a una variable fuera de la función inicializada, aunque no se haya declarado:
miFuncion();
consola.log (foo); // 20
funciónmifunción() {
foo = 20;
}
En el bloque de código anterior, JavaScript declara automáticamente Foo y lo eleva a la parte superior del alcance global, ignorando el alcance en el que lo inicializó.
Puede usar el modo estricto para corregir este comportamiento y arrojar un error si intenta acceder a la variable fuera del alcance de su función.
El modo estricto no deja de izar por completo. En cambio, evita las formas de elevación más confusas y propensas a errores. Todavía es importante comprender el concepto general y las reglas detrás de la elevación, incluso cuando se usa la red de seguridad de modo estricto.
Para optar por el modo estricto a nivel global, declare la sintaxis en la parte superior de su archivo de script:
"usarestricto"; // o 'usarestricto'
Para optar por el modo estricto a nivel de función, declare la sintaxis en la parte superior del cuerpo de una función antes de cualquier declaración:
funciónmyStrictFunction() {
"usarestricto";
}
Si declara el modo estricto a nivel de función, la configuración se aplicará solo a las declaraciones dentro de esa función.
Declarar el modo estricto a nivel global evita que se acceda a las variables fuera de sus respectivos ámbitos:
"usarestricto";
miFuncion();
consola.log (foo); // ReferenceError: foo no está definido
funciónmifunción() {
foo = 20;
}
Con el modo estricto activado, el compilador de JavaScript levantará miFunción() a la parte superior de su alcance sin la variable no declarada.
Comprenda lo que afecta el izaje
Elevar es bastante exclusivo de JavaScript y puede ser un comportamiento muy confuso para entender. Puede afectar variables y funciones, pero hay formas de prevenirlo si es necesario.
Varios factores pueden afectar la elevación, por lo que es mejor evitar cualquier aparición de elevación de variables o funciones en su código.