No tienes acceso a esta clase

¡Continúa aprendiendo! Únete y comienza a potenciar tu carrera

Convierte tus certificados en títulos universitarios en USA

Antes: $249

Currency
$209

Paga en 4 cuotas sin intereses

Paga en 4 cuotas sin intereses
Suscríbete

Termina en:

19 Días
15 Hrs
15 Min
13 Seg

Hoisting

10/30
Recursos

Hoisting es un término para describir que las declaraciones de variables y funciones son desplazadas a la parte superior del scope más cercano, scope global o de función. Esto sucede solamente con las declaraciones y no con las asignaciones.

El código permanece igual, solo es una interpretación del motor de JavaScript. En el caso de las variables solamente sucede cuando son declaradas con var.

Hoisting en variables declaradas con var

Mira el siguiente código, ¿qué crees que sea el resultado del console.log?

console.log(nombre) // undefined
var nombre = "Andres" 

La respuesta del console.log es undefined, porque al hacer referencia a una variable que no está declarada aún, JavaScript crea esta variable antes de declararla y le asigna un valor de undefined.

Lo que JavaScript está haciendo sería lo siguiente:

// Hoistin: Declara y asigna undefined
var nombre = undefined
console.log(nombre) // undefined
nombre = "Andres"

Aquí el nombre de Hoisting o elevación.

Hoisting en funciones

Mira el siguiente código, ¿qué crees que sea el resultado del console.log?

console.log( saludar() )

function saludar() {
  return "Hola"
}

La respuesta es "Hola", porque al invocar una función que no está declarada, JavaScript la eleva y por eso podemos invocar una función antes de declararla.

// Hoisting: Declara la función antes de ser invocada
function saludar() {
  return "Hola"
}

console.log( saludar() ) // "Hola"

Pero, lo que realmente sucede es que JavaScript guarda la función en memoria en la fase de creación de un contexto de ejecución, no asigna undefined como con las variables.

Buenas prácticas

El tema de Hoisting solo sucede con las declaraciones de variables y funciones, por lo que se** recomienda declarar las variables y las funciones lo más arriba posible del código**, para evitar errores.

También, el tema de hoisting ya está solucionado con las nuevas formas de declarar variables con let y const.

Contribución creada por Andrés Guano (Platzi Contributor).

Aportes 813

Preguntas 89

Ordenar por:

¿Quieres ver más aportes, preguntas y respuestas de la comunidad?

Realice un resumen sobre lo que yo entendí de lo que es el hoisting, aunque no sé que tan correcto sea lo que yo aprendi, igual se los dejo esperando les sea de ayuda a entender el concepto de mejor manera:

El Hoisting es un proceso del compilador de JavaScript, que consiste en que la declaracion de las variables y las funciones son llevadas al inicio del codigo, sin importar su posicion, para su procesamiento, sin embargo, la inicializacion de las variables no es llevada al inicio del codigo para su compilacion, sino solo su declaracion, lo cual suele dar espacio a errores cuando se declara una variable sin inicializarla y se procesa en el codigo antes de haber llegado a su inicializacion, lo cual nos suele dar una variable con valor undefined, ya que la variable sí fue almacenada en memoria, pero no se le asigno un valor hasta despues de su ejecución.

Aqui un ejemplo de esto:

saludo();

function saludo() {
    console.log("Hola " + nombre);
}

var nombre = "Aaron";

El output de este codigo seria el siguiente:

Hola undefined

Debido a que como lo hemos dicho, la variable se tomo en cuenta y se le asigno memoria, sin embargo, el compilador no la inicializo y se le dio el valor de undefined, y con ese valor se ingreso a la funcion, y ya despues de correr la funcion se le asigno el valor.

Este comportamiendo se puede entender facilmente si se comprenden estos dos puntos esenciales:

  • Las funciones siempre se mueven arriba del scope. Por lo tanto, podemos elegir donde declararlas y usarlas.
  • La declaración de las variables se mueven arriba del scope, pero no la asignación. Antes de usar una variable, habrá que crearla y asignarla.

En base al segundo punto, fue por eso que se cometio el error de usar la variable antes de inicializarla, pues sin problema el compilador le asigna memoria, pero no el valor hasta despues.

Basicamente por pasos, lo que hizo el compilador fue esto:

Tenemos el codigo asi:

saludo();

function saludo() {
    console.log("Hola " + nombre);
}

var nombre = "Aaron";
  1. El compilador toma las funciones y variables y las “sube” en el codigo, sin inicializar variables:

var nombre;

function saludo() {
    console.log("Hola " + nombre);
}

saludo();

var nombre = "Aaron";
  1. Le asigna memoria a la variable y le da el valor de undefined al suceder la asignacion de memoria

var nombre = undefined;

function saludo() {
    console.log("Hola " + nombre);
}

saludo();

nombre = "Aaron";

Y como hemos visto, la variable se asigna como undefined y posteriormente su utiliza al llegar a la linea:

saludos()

pues ahi lo que hace es ejecutar la funcion que ya fue procesada, pero con un valor de la variable que aun no se le asigno, quedando como undefined.

  1. Despues de correr la funcion, le asigna el valor correcto a la variable ya declarada:

var nombre = "Aaron";

function saludo() {
    console.log("Hola " + nombre);
}

saludo();

Pero ya es demasiado tarde, pues la funcion ya fue ejecutada.

Es por eso que se tiene como buena practica declarar e inicializar tanto variables como funciones al inicio de nuestro programa, sin importar donde sean utilizadas, pues de esta manera se evita usarlas antes de ser inicializadas.

Debemos saber que el hoisting solo sucede con las palabras claves var y function, por lo tanto esto nos dice que solo se da en las versiones de ECMAScript 5 o Inferiores, ya que en la version 6 y superiores se permite la declaracion de variables con let y const, que son dos nuevas variables que no activan hoisting.

CONSEJO en Visual Studio Code:

¿Qué es Hoisting?
En JavaScript, las declaraciones (por ejemplo, de variables o funciones) se mueven al principio de su scope o ámbito. Este comportamiento se conoce como hoisting y es muy importante tenerlo en cuenta a la hora de programar para prevenir posibles errores.

  • Las funciones siempre se mueven arriba del scope. Por lo tanto, podemos elegir donde declararlas y usarlas.
  • La declaración de las variables se mueven arriba del scope, pero no la asignación. Antes de usar una variable, habrá que crearla y asignarla.

Funcionamiento del hoisting


|
Les adjunto el articulo completo
https://dev.to/lydiahallie/javascript-visualized-hoisting-478h

FUN FACT: El concepto de Hoisting en inglés se refiere a “izar”, es decir elevar un objeto. Como una bandera o con estas cosas:

Hoisting es cuando las variables y las funciones se declaran antes de que se procese cualquier tipo de código. El Hoisting funciona de ECMAScript 5 para abajo, de ECMAScript 6 en adelante no sucede porque el Hoisting sucede con var y function. En las versiones de ECMAScript 6 en adelante aparece const y let.

A mi modo de ver, y viniendo de un lenguaje fuertemente tipado y fuertemente estructurado como Delphi, me parece que la mejor disciplina seria:

  1. Declaro e inicializo las variables - Arriba del archivo
  2. Declaro las funciones - Medio del archivo (por así decirlo)
  3. Utilizar variables y funciones - Final del archivo

de ese modo consigo tener un archivo mas legible y ordenado y además evito el hoisting

var miNombre = "Platzi";
function mostrarNombre(miApellido){
	console.log(miNombre + " " + miApellido);
}

mostrarNombre("Cursos Online");

Nota del día: Las funciones se declaran al inicio del code y si usamos varibales que aún no estén declaras entonces debemos asegurarnos que la llamada de la función se realice después de setear la variable, así podremos evitar problemas con el hoisting.

interesante el concepto de hoisting.
en resumen.


//aqui se da el hoisting en las variables
//donde la variable es usada antes de ser declarada
//
console.log(miNombre);
var miNombre = "Francisco";

hey();

function hey() {
    console.log("hola " + miNombre);
}

var miNombre = "Francisco";

//Lo ideal es que se declaren la funcines al inicio

Esto fue lo que entendí y lo estructuré así, espero ayudar.

//MALA PRACTICA, EVITA EL HOISTING, NO RECOMENDABLE
miNombre();

function nombre (){ //Local
    var miApellido = "Sanchez";
    console.log(miNombre + " " +miApellido)
}

var miNombre = "Maximo";

/**
 * JavaScript es tan poderoso que entiende aunque tu codigo este desordenado
 * pero es una mala practica tener elcodigo así
 * Lo recomendable es declarar las variables y despues, despues la función y sus instrucciones
 * y por ultimo mandar a llamar la funcion
 * tal como se muestra abajo
 */

 //BUENA PRACTICA
var miNombre = "Maximo";

function nombre (){
    var miApellido = "Sanchez";
    console.log(miNombre + " " +miApellido)
}

miNombre();```

No se si soy el unico pero no entiendo un carajo el profesor explica a medias y no lo entiendo; ya se que es dificil pero no lo podria explicar mas sencilo porque no lo entiendo.

HOISTING

- Las funciones siempre se mueven arriba del scope. Por lo tanto, podemos elegir donde declararlas y usarlas.
- La declaración de las variables se mueven arriba del scope, pero no la asignación. Antes de usar una variable, habrá que crearla y asignarla.

- Se trata del comportamiento predeterminado para la declaración de las variables, funciones, y en general, la declaración de cualquier contexto en Javascript.
- El hoisting solo aparece en funciones y variables del ecmascript 5 para abajo
- El hoisting del ecmascript 6 en adelante aparece en funciones, variables, const y let

Algo que no explicó, es que el navegador cuando lee todo el codigo, primero ejecuta las funciones y después toda otra linea de codigo. Es decir, que las funciones (salvo en este caso) se ejecutan donde sea que las pongas

Hola, les comparto mis anotaciones para esta clase.

Breve resumen con explicación.

// HOISTING
    //Es la forma en que JS organiza las declaraciones

        //  Como se escriben
            sumar();
            var x = 2;
            function sumar(){
                var suma = x + y;
                return suma;
            }
            var y = 1;

        // Como JS lo organiza
            function sumar(){
                var suma = x + y;
                return suma;
            }  
             var x = 2;
             var y = undefined;
            sumar();
             var y = 1;
            // Primero se cargan las funciones, segundo la declaración de variables y el resto en el orden normal del código.

Aparte de lo que el profesor explico también es bueno aclarar que el Undefined se debe principalmente porque la programación tiene un tema básico pero importante que es la programación secuencial quiere decir que el código se lee de arriba hacia abajo

CONSOLE.LOG
console.log () escribe un mensaje en la consola.
Es útil para realizar pruebas.
Puedes presionar F12 para ver la consola.
ejemplo:

console.log("Platzi")
.
var misfrutas = ["manzana", "naranja", "Mango", "Kiwi" ];
console.log(misfrutas);

console.log te acompañará a lo largo de tu vida como programador, úsalo bien por que…

tuve que ver la clase varias veces, pero al final si se pudo burro xd

/* Hoisting es cuando las variables o las funciones 
se declaran antes de.*/

/* El Hoisting funciona de ecmascript 5 para abajo */

console.log(miNombre); /*  es una funcion para imprimir en consola */

var miNombre = "tu nombre";

/*  EL resultado SERIA undefined!!!!!
Esto pasa por que hay hoisting, dado que estamos 
llamando a una variable que todavia no ha sido definida
*/
/* Tambien hay hoisting con funciones! */
hey(); /* Llamamos la funcion primero */
function hey() {
    console.log ("Hola " + miNombre2);
}
var miNombre2 = "Felipe";
/* Si llamamos una variable despues de declarar
una funcion, esta no tomara el valor, como podemos observar
en el ejemplo de hey, pero las funciones si es valid*/

2 puntos por ser el primero en escribir

AÑO 2023.

No he entendido muy bien el lenguaje de javascript pero en unos años buscare este comentario y diré si pude !!

Así que animo , no te desanimes y por mas que no entiendas síguelo intentando.

—> Hoisting: Sucede cuando llamamos una variable antes de declararla e inicializarla.

  • var (solo la declaración), la function (por completo) y el import (por completo) “suben” hacia arriba del scope.
  • Se modifica la forma en que JS interpreta nuestro código
// Lo que nosotros ponemos:

console.log(miNombre);

var miNombre = "Juan";

// Lo que enrealidad sucede por el Hoisting:

var miNombre;

console.log(miNombre); // Me devuelve un undefined

miNombre = "Juan"; // Recien aqui se inicializa la variable

Hoisting es cuando las variables y funciones se declaran antes de que se procese cualquier tipo de código. El Hoisting ahorita solo pasa con versiones pasadas de JavaScript es decir de M script 5 hacia abajo y de M script 6 hacia delante ya no sucede, por que el Hoisting solo sucede con dos palabras claves que son variable y función y del M script 6 se agregaron dos mas que son Const y Led.
Cuando se declara una variable y se puede inicializar de inmediato o después.
Como sucede un Hoisting y como evitarlo: el Hoisting sucede cuando necesitamos o procesamos una variable que se declara después de nuestra línea de código que la utiliza, ejemplo:
Console.log(miNombre);
Var miNombre = “Ezequiel”;
Undefined
Aquí lo que realiza JavaScript es crear una variable con el nombre de la variable que mandamos y no hemos declarado inicializada con el valor de “undefined”.
El Hoisting también sucede con las funciones. Cuando nosotros mandamos llamar una función antes de su declaración nos mostrara el resultado que queremos siempre y cuando las variables que ocupe estén declaradas antes de llamar la función.
Por buenas practicas todas las funciones y variables que vamos a utilizar deben se declaradas al inicio del código. Vamos ya avanzados y ocupamos una variable y funciones nos regresamos al inicio donde declaramos las funciones y variables y colocamos las nuevas que ocupaos, con esto evitamos el Hoisting.

Si se intenta llamar una variable antes de poderla definir, simplemente va a arrojar un error diciendo que la variable no esta definida.

ósea que tiene que ser así para que funcione ¿cierto? miren mi codigo y prueben

saludar();
var miNombre = "Javi";

function saludar() {
    console.log("hola " + miNombre)
}

luego enter en la consola y se darán cuenta.

Las variables y las funciones se procesan antes de ejecutar cualquier código, pero las funciones se declaran antes que las variables.

Buenas prácticas: Declarar las variables antes de ejecutar cualquier función.

HOISTING

Es cuando las variables y las funciones se declaran antes de que inicie (procese) cualquier tipo de código.

Por buenas prácticas todas las funciones que se ocupen en el código, deben declararse al inicio del código.

En resumen:

Mostrar en pantalla una variable no definida, provocará un error:

console.log(nombre);

La consola muestra: ReferenceError: nombre is not defined
Este error corta la ejecución del programa.

Declararla después de utilizarla, provocará que el valor en ese momento de la variable sea undefined

console.log(nombre);
var nombre = "Matias";

La consola muestra: undefined, esto no corta la ejecución del programa.
Nota: Esto solo ocurre con la palabra reservada var, si utilizan let o const obtendrán un error: Cannot access ‘nombre’ before initialization, y la ejecución del programa se vera interrumpida.

Espero les sirva.

Proyectará o imprimi en la consola #miNombre 👍

En este link el profesor Leónidas Esteban, también explica muy bien que es el Hoisting.

Yo quede más loco

Creo que va a salir Diego

Hoisting: Cuando las Variables y funciones se declaran antes de la ejecución del código
Creo que para el ejercicio saldrá undefined, ya que está imprimiento una variable que no declaro o bueno no ha tomado valor…creo

⚠ Evita el usar hoisting para evitar errores a futuro.

Explico Scope a mi manera de la clase pasada, y referencio el tema de la clase actual.

Con aprecio para la comunidad, y los nuevos.

7 de 16.

Saludos,

Antes de que corra el video: Pienso que a la hora de correr el codigo primero se van a buscar las funciones y luego se van a procesar donde se hayan declarado… A ver si tengo razon.

se mostrara un undefined.
El Hoisting seria, solo declarar implicitamente las variables o funciones al inicio del contexto, pero no las inicializa. Todo esto se realiza en la compilacion.

Hoisting

Es cuando las variables y las funciones se declaran antes de que se procese cualquier tipo de código. El hoisting solo pasa con versiones de Ecmascript5 hacía abajo. De Ecmascript6 en adelante ya no sucede, porque el hoisting solo sucede con dos palabras clave “Variable” y “Función”. En las nuevas versiones presentaron 2 nuevas variables que son “Const” y “Let”.
Vamos a declarar la variable e inicializarla.

//Declarar
var miNombre; 
//Inicializar
miNombre ="Iris";

Si en el navegador hiciéramos esto

console.log(miNombre)
var miNombre ="Iris";

Sucedería el hoisting, porque estamos mandando a llamar una variable, antes de declararla e inicializarla.

Me gustó esta explicación:

https://www.youtube.com/watch?v=uI6o97A4IrI

No entiendo para que la gente utilizaba hoisting antes es muy desordenado a mi parecer

En el caso de la función, el output es que la función si se va a ejecutar, pues lo que he aprendido en otros cursos es que siempre las funciones se leen primero ya que al leerlas se les reserva un espacio en memoría, después se vuelve al inicio y hay si se lee el resto del codigo, siempre en el orden de arriba hacia abajo, pero por buena práctica o me parece que se mira mejor, declarar e inicializar primero antes de llamar, tanto para variables como para funciones.

Buenas tardes profesor De Granda
Este es el resultado que arroja la inspección en la página de Google. Primero el nombre, y luego el undefined. ¿Por qué?

console.log(miNombre);
var miNombre = “Luis”;
VM3227:2 Luis
undefined

hey();

function hey() {
console.log("Hola " + miNombre);
}

var miNombre = “Aaron”;

Hola undefined
undefined

al estudiar este tema me ayude con el siguiente articulo.
https://www.freecodecamp.org/espanol/news/contexto-de-ejecucion-de-javascript-y-hoisting-explicados-con-ejemplos-de-codigo/

se los recomiendo y de paso también indicarles que si desean ir aprendiendo en Platzi y practicar código en freecodecamp pueden hacerlo totalmente gratis, yo he entendido la mayoría con las dos plataformas, ya programo mucho mas por la practica y ejemplos que están en esa pagina, no se van a arrepentir, ademas por que les indican el paso a paso y es solo digitar el código. ademas si terminan el curso completo les dan certificado y sirve para adjuntarlo con el de Platzi.
https://www.freecodecamp.org/

hola colegas , emocionado de estar aca , aun me cuesta entender varias cosas , pero con la motivacion intacta y enfocado siempre en aprender … saludos !!

En resumen:

  • Las funciones y las variables se ejecutan antes de todo el código pero las variables sólo se declaran y las funciones se ejecutan por completo antes que las variables al igual que los import, algo que no sucede con las clases.

Consejo:

  • Declarar las variables y las funciones lo más arriba posible del código, para evitar errores.

Hola 👋, por aquí les dejo un par de recursos que me ayudaron a entender mejor el Hoisting

📌 https://www.youtube.com/shorts/IgXgH6H52og

Profe Sacha Lyfszic 👇
📌 https://www.youtube.com/watch?v=uI6o97A4IrI

Gentleman Programming 👇
📌https://www.youtube.com/watch?v=clc_pSl5ifA&t=512s

El resultado será un error/undefined, porque para que una variable se pueda ejecutar, toca declararlas antes de ser ejecutadas, porque el scope va de local a global 😄 (gracias #PlatziDay)

Hoisting ≠ Hosting

En resumen; el hoisting; son problemas de orden de ejecución. listo, a dormir!

I’m stronger, I’m smarter, I’m better, I am better! 👺😆

Después de ver la clase, leer documentación y ver otros videos finalmente entendí!

a mi me salio el nombre en la consola.

Con este video entendí todo mucho mejor https://www.youtube.com/watch?v=EvfRXyKa_GI

Esta en Ingles

Hosting: Cuando las variables y funciones se declaran o procesan antes que se ejecute cualquier tipo de código.
El hosting solo sucede con las palabras variable y función, la nueva version de ECMAScript 6+ presentaron const y left, la cual te permite ya no generar un hosting.

El hosting es una cuando no declaramos e inicializamos nuestras variables al principio. Lo que provocara que se eleven nuestras variables al principio y se declaren ellas mismas con un valor undefined.

var miNombre; //Se declara la variable
miNombre = "Diego";  //Se inicializa la variable

//A veces se declara y se inicializa en ese momento
//var miNombre = "Diego";


console.log(miNombre); //El Console Log es una funcion que nos da    el navegador y esta funcion nos ayuda a imprimir los resultados de agunas funciones y nos ayuda ver en la consola ciertas cosas

var miNombre = "Diego";

//Si nosotros ejecutamos esto en el navegador, el resultado sera un Undefined que es un valor que agrega directamente el navegador.

//Lo que pasa aca es algo que se llama hoisting que pasa cuando primero mandamos llamar una variable antes de declararla e inicializarla.

//En este proceso JavaScript al ver que no esta declarada, la declara y al ver que no esta inicilizada, le agrega el valor de Undefined.


//Ahora, esto sucederia si declaramos primero la variable

var miNombre = undefined;
console.log(miNombre);
miNombre = "Diego"

//Aqui la consola arrojara la variable como indefinida y el nombre "Diego" al inicializar la variable

var miNombre = undefined;
console.log(miNombre + "Soy ese hoisting")

miNombre = "Diego"

//Aqui sucedera lo mismo que con el ejemplo anterior a diferencia que la consola arrojara undefined como parte de la variable Nombre y el string "soy ese hoisting"


//Tambien existe Hoisting en las funciones que como se comentaba, el Hoisting es cuando las variables y las funciones se declaran al inicio del codigo antes de que se ejecute cualquier linea


hey();

function hey() {
    console.log("Hola " + miNombre);
}

var miNombre = "Diego";

//Si se corre esta funcion en el navegador, ¿Que crees que va a pasar? Nos sale un error al mandar llamar un string sin el signo de +

//Al adicionar el + antes de la variable miNombre, el resultado que arrojara la consola sera "Hola undefined" y esto pasa porque las variables y funciones se procesan antes de ejecutar cualquier codigo y las funciones se declaran antes que las variables.
//Todas las funciones deben ser declaradas al inicio del codigo por buenas practicas

Este video puede ayudar mucho: : https://www.youtube.com/watch?v=uI6o97A4IrI

Hola aqui va mi resumen espero les sirva.

Mi resumen para esta clase:

  • Hoisting es diferente a Hosting.

  • Hoisting se refiere cuando declaramos funciones y variables, y luego las llamamos.

  • Aplica tanto a funciones como a Variables:

  • En var se aplica primero declarando var y luego llamandola. No funciona al revés.

  • En function se puede llamar una funcion antes de ser declarada si y solo si las variables que esta utiliza estan declaradas al inicio del còdigo.

Buenas prácticas:

  • Declarar variables al inicio del codigo y declarar funciones al inicio del bloque de código.

Gente les comparto este link de you tube, para comprender. Excelente video luego de algunos que vi. https://www.youtube.com/watch?v=sv4-Lq495Qc

La documentación de Mozilla explica muy bien el hoisting a mi parecer. Además, permite entender cómo funciona por debajo en compilación:
https://developer.mozilla.org/es/docs/Glossary/Hoisting

Por ejemplo, se explica el funcionamiento en memoria:

“una estricta definición de hoisting sugiere que las declaraciones de variables y funciones son físicamente movidas al comienzo del código, pero esto no es lo que ocurre en realidad. Lo que sucede es que las declaraciones de variables y funciones son asignadas en memoria durante la fase de compilación, pero quedan exactamente en dónde las has escrito en el código.”

Hoisting

.

Hoisting en variables

El interprete de JavaScript reserva un lugar en memoria para las variables declaradas con var antes de que el código se ejecute, y esto causa que si se utiliza una variable antes de su declaración ésta tenga el valor undefinded. Éste fenómeno se identifica como hoisting.
.

console.log(myVar); // undefined
var myVar = "Hello World!"

.
Las declaraciones hechas con let y const no presentan hoisting.
.
El hoisting suele ser explicado como si el intérprete separara la declaración y la inicialización de las variables y moviera las declaraciones al comienzo del código o al comienzo de una función (las variables var tienen scope de función). Esto también permitiría que las variables pudieran ser utilizadas previo a asignarles un valor y tendrían éstas el valor undefined.
.

Hoisting en funciones

Las funciones declaradas con function también presentan hoisting en JavaScript, pero a diferencia de como pasa con las variables, las funciones se guardan completas en memoria previo a la ejecución del código, por lo que es posible invocar a una función antes de declararla.

Creo que podría resumir lo que significa Hoisting con la expresión: “No puedes obtener agua si antes no abres el grifo”, no se puedo usar una variable sin antes haberla inicializarla declararla.

Que es el hoisting?
JavaScript Hoisting se refiere al proceso mediante el cual el intérprete asigna memoria para declaraciones de funciónes y variable antes de la ejecución del código.

piensado como un compilador de variables y funciones antes de la ejecucion del codigo.

Resumen:

  • Es cuando las variables y funciones son declaradas, independientemente de su posición, antes del procesamiento del código.

  • Sin embargo la inicialización de las variables no sucede antes del procesamiento, por lo cual el valor de las variables será undefined hasta llegar a la parte del código donde son inicializadas.

  • Esto sucede sobre las palabras claves var y function.

  • Esto no sucede sobre las palabras clave const y let ( Agregadas en ES6)

  • Como buena práctica las funciones siempre se escriben las funciones al inicio.

Tenemos hoisting en las variables y hoisting en las funciones. Las funciones se declaran antes que las variables. Pero las variables a fuerza se deben declarar desde el principio, sino nos va a marcar error.

Apuntes completos en Notion

Excelente!

Hola @degranda no vi en la parte de enlances la lectura acerca de hosting, saludos!

Esta información podría complementar lo explicado en el vídeo por si quieren ver otros ejemplos https://developer.mozilla.org/es/docs/Glossary/Hoisting

Dará error, porque aún no se ha declarado ni inicializado la variable miNombre

Dejo un video del gran Sacha Lifszyc donde explica muy bien este tema:

¿QUÉ ES EL HOISTING en JAVASCRIPT? | JS en ESPAÑOL

por si a alguien le queda alguna duda lea este post, espero le sirva igual que a mi o mas https://www.jasoft.org/Blog/post/Elevacion-de-variables-(hoisting)-en-JavaScript.aspx

Por cierto, como mi pc tenia mala la fecha y hora, ya envié el comentario de mis respuestas pero parece que estoy en el futuro. 🤣😎

Solo es para agregarle humor al curso

9:57 ERROR… aun no concatenas el “hola” con la variable

Perdí la cuenta de las veces que tuve que regresar y repasar los ejemplos y las definiciones de este vídeo hasta que me quedara completamente claro. ¡Excelente clase!

Undefined.

no podria ejecutarse, saldria “undefined”

jejjeje super entendido.

“Las funciones se declaran antes que las variables”

undefine

  • El hoisting solo sucede con dos palabras clave: var y function.

HOISTING
Es cuando las variables o funciones de declaran antes de cualquier tipo de código
Antes de versión 5 eran para var y function
De 6 en adelante ya no const y let ya no tienen hoisting
HOISTING CON VARIABLES
Cuando se llama una variable antes de iniciar la variable muestra undefined
El compilador hacer lo siguiente: define la variable con un valor inicial igual a undefined.
Buenas practicas  Declarar variables al inicio del código

HOISTING CON FUNCIONES
Buenas practicas Todas las funciones deben estar al inicio del código
Las funciones se declaran antes que las variables

Dejo esta documentación de JS para el que este interesado en llevar todo en profundidad https://developer.mozilla.org/es/docs/Web/JavaScript/Guide

va a salir error! por no concatenar el hola y la variable de miNombre

todo claro 😃

Esta bueno el articulo del enlace para poder complementar lo que se enseña en la clase.

Hosting!!!

Debemos quedarnos con varios conceptos:

*Las funciones siempre se mueven arriba del scope. Por lo tanto, podemos elegir donde declararlas y usarlas.

*La declaración de las variables se mueven arriba del scope, pero no la asignación. Antes de usar una variable, habrá que crearla y asignarla.

*Para buenas prácticas de desarrollo, declaramos las funciones al iniciar el código y solo se llaman al tener los valores que se usarán.

Si vienen de la clase de Responsive Design con Leonidas y realizaron la instalacion de Node.js pueden usar la terminal de VS code para realizar las pruebas para hacerlo van a la parte superior encontraran una opcion que dice Terminal > nueva Terminal. Una vez le den click van a tener algo como esto. Pueden ejecutar el archivo JS usando el comando node como esta en la imagen.

estoy pensando que escogi la actualizacion equivocada, habla de ES5 y 6 y van en la 10 NO SE

Entonces como buenas prácticas hay que declarar las variables y funciones hasta la parte de arriba de nuestro código para evitar este tipo de Hoisting

Resultado
#1: Diego

Resultado:
#2: Hola diego (si la concatena)

Creo que va a fallar porque falta el signo + despues de "Hola "

Hoisting: Cuando las variables y las funciones son llamadas antes de ser declaradas.

Listo.

Undefined