1

Hoisting

Para entender un poco del motor de Javascript.

En la mayoría de los lenguajes de programación, el ámbito / alcance de una variable está en el bloque donde fue definida (block-level scope), por ejemplo, dentro de un bloque de instrucciones if, for, while. En JavaScript (ECMAScript 5.1) esto no es así, puesto que el alcance de una variable es el de la función en la cual fue declarada (function-level scope).

El motor V8 de javascript consta de dos procesos Heap y Stack, cuando arranca la ejecucion de javascript el heap hace un barrido por todo nuestro codigo mientras que esl stack es el encargado de ejecutarlo.
En la etapa de Heap extiste algo que se llama efecto hoisting o “elevación” es una de las particularidades de JavaScript y se da cuando definimos una variable en el interior de una función (en el scope), entonces el intérprete interno pasa a declararla al comienzo de su contexto (la eleva)
(function () { for(var x = 0; x < 3; x += 1) { console.log(x); } console.log(x, "todavía existe!!"); }());
Así es como lo interpreta el motor
(function () { var x; // <- la variable es elevada for(x = 0; x < 3; x += 1) { console.log(x); } console.log(x, "todavía existe!!"); }());
Aca vemos otro ejemplo
var x = 5; (function () { console.log("x:", x); //se espera 5, pero retorna undefined var x = 10; console.log("x:", x); //se espera 10 }());
Como lo vio V8
var x = 5; (function () { var x; // <- la variable es elevada console.log("x:", x); //-> undefined x = 10; console.log("x:", x); //-> 10 }());
Hoisting no solamente actúa con las definición de variables también lo hacer con funciones, pero hay que prestar mucha atención en como están definidas las funciones.
console.log("fn1", fn1()); //que imprime? console.log("fn2", fn2()); //que imprime? //function expression var fn1 = function() { return 1; }; //function declaration function fn2() { return 2; }
Es muy posible que nuestra lógica apunte a pensar que V8 interprete de la siguiente forma.
var fn1 = function() { return 1; }; function fn2() { return 2; } console.log("fn1", fn1()); //que imprime? console.log("fn2", fn2()); //que imprime? //function expression //function declaration

En este caso no tenemos una definicion de fn1 lo que tenemos es una asignacion por referencia de una funcion a una variable, por lo que V8 lo interpreta de la siguiente forma.
var fn1; // <- la variable es elevada function fn2() { return 2; } // <- declaración y definición son elevadas console.log("fn1", fn1()); // throw TypeError: undefined is not a function console.log("fn2", fn2()); //2 //function expression fn1 = function() { return 1; };
Por definición Hoisting hace que la declaración de variables sea procesada antes de que cualquier código se ejecute, declarar una variable en cualquier parte es lo mismo que declararla al inicio. Esto también significa que una variable puede ser usada antes de su declaración.

Espero que les sea de utilidad.
Saludos

Escribe tu comentario
+ 2
Ordenar por:
1
3Puntos

The post has helped me understand more about hoisting. It’s easy to understand for beginners.
spanish dictionary

1
3Puntos

If you want to sell your used old car in hamburg then auto ankauf hamburg is best choice for selling out your old cars

1
124Puntos

An article worth noting and should be learned. Thank you for providing this great information. shell shockers

1

When participating in the forum, I found very good and very positive information from the forum. I will stay tuned for the latest news from the forum.
geometry dash

1
7Puntos

Can nicely write on similar topics! Welcome to here you’ll find out how it should look. soap2day