A煤n no tienes acceso a esta clase

Crea una cuenta y contin煤a viendo este curso

Hoisting

8/22
Recursos

Aportes 656

Preguntas 60

Ordenar por:

驴Quieres ver m谩s aportes, preguntas y respuestas de la comunidad? Crea una cuenta o inicia sesi贸n.

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 鈥渟ube鈥 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.

驴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.

CONSEJO en Visual Studio Code:

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 鈥渋zar鈥, 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

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

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

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();```

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鈥

/* 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*/

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 = 鈥淓zequiel鈥;
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 鈥渦ndefined鈥.
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.

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

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.

贸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.

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.

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.

鈥> 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) 鈥渟uben鈥 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
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鈥reo

鈿 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,

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

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.

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

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 鈥淰ariable鈥 y 鈥淔unci贸n鈥. En las nuevas versiones presentaron 2 nuevas variables que son 鈥淐onst鈥 y 鈥淟et鈥.
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

2 puntos por ser el primero en escribir

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:

鈥渦na 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: 鈥淣o 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

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.

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 鈥渉ola鈥 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 鈥渦ndefined鈥

jejjeje super entendido.

鈥淟as funciones se declaran antes que las variables鈥

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 鈥榥ombre鈥 before initialization, y la ejecuci贸n del programa se vera interrumpida.

Espero les sirva.

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 飪燭odas 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

Excelente explicacion 馃槂

Undefined

HOISTING
Es cuando las variables y funciones se declaran antes de procesar el c贸digo.
鈥 Hoisting en variables
鈥 Hoisting en Funciones
A partir de ECMASCRIPT 6 el Hoisting ya no ocurre, debido a que surgieron let y const para solucionarlo.

en la funci贸n creo que imprimir谩 "hola undefined "

Hoisting -> Es cuando las variables y funciones se declaran antes de que se procese cualquier trozo de c贸digo. Solo pasa con versiones de ECMA <= 5, solo pasa con Var y function.
En ECMA Script 6 se incorporaron las palabras let y const.
Hoisting con variables.
A veces se pueden llamar variables declaradas, pero no inicializadas.
//Ejemplo 1 - Hoisting
console.log(miNombre2);
var miNombre2 = 鈥淒iego鈥;
//resultado -> undefined

Javascript al detectar en console.log que estamos llamando a una variable que no est谩 declarada en ese momento de ejecuci贸n, genera una variable undefined por nosotros y as铆 ejecutar el c贸digo. Es como si hiciera lo siguiente:
//Ejemplo 1
var miNombre2 = undefined;
console.log(miNombre2);
miNombre2 = 鈥淒iego鈥;
//resultado -> undefined

Hoisting con funciones.
Las variables y la funciones se ejecutan antes, sin embargo las funciones se declaran antes, sube la funci贸n y al momento de ejecutar la variable la declara como undefined, sin embargo el c贸digo de la funci贸n si obtenemos el resultado esperado.
Como buenas pr谩cticas las funciones se deben declarar al principio del c贸digo. Para evitar los problemas de hoisting.
//Ejemplo 2
hey();
function hey(){
console.log("Hola " + miNombre3);
}
var miNombre3 = 鈥淧ablo鈥;
//resultado -> Hola undefined

Esto es un mundo muy interesante. Vengo de otros lenguajes donde no ocurre esto lo cual es muy divertido 馃憤

creo que va dar error porque no lo concateno

undifine

Hola, aqu铆 mi aporte:
El hoisting es este proceso en el que cuando el codigo se encuentra en el proceso interpretaci贸n, se 鈥渆levan鈥 a las funciones y variables declaradas (var y function), es decir, se toman y se les asigna un espacio de memoria antes de ejecutar el c贸digo. Con esto pueden ocurrir algunos errores o resultados inesperados a la hora de mandar llamar funciones y/o variables si no se hace una declaraci贸n e inicializaci贸n de las mismas en un lugar adecuado.
Ejemplo:

El resultado de ejecutar el c贸digo fue Hola soy undefined. Cuando el c贸digo entro al proceso de interpretaci贸n, elevo a la funci贸n para asignarle un espacio de memoria, es decir las ley贸 primero, en esta funci贸n se encontr贸 a la variable name y como est谩 no estaba declarada le asign贸 un valor undefined.

Luego, cuando se manda a llamar la funci贸n myName(); se ejecuta con el texto 鈥Hola soy鈥 + el valor que se le agrego a la variable name en el hoisting 鈥渦ndefined鈥.

El hoisting no aplica con la inicializaci贸n de las variables, es decir cuando el codigo se est谩 interpretando no jala a la variable con su valor de inicializaci贸n, en este caso 鈥淏ere鈥, solo eleva o toma a var name;



Luego de que pasa el proceso de interpretaci贸n, sigue el proceso de ejecuci贸n, y ahora s铆 se ejecuta l铆nea por l铆nea el c贸digo, he aqui la importancia de declarar e inicailizar variables en el orden adecuado ya que en el ejemplo, la variable name se declar贸 e inicializ贸 despues de declarar la funci贸n en donde se utiliza dicha variable, por eso el resultado se vi贸 afectado cuando ocurri贸 el hoisting.

Si cambiamos el c贸digo y modificamos el orden de declaraci贸n de la variable se pude ver este proceso.


En este ejemplo se puede observar otro punto, cuando sucede el hoisting, va a respetar el scope global y local:

Como se explico antes, cuando sucede el hoisting, las variables toman un valor de undefined.

  • En el resultado 鈥淗ola soy undefined鈥 vemos que aunque hay una variable name inicailizada como 鈥淏ere鈥 , el primer console.log no toma ese valor cuando se ejecutan esas primeras l铆neas, ya que esta primera variable name est谩 declarada fuera de la funci贸n, por lo que toma el valor que se le asign贸 en el hoisting, undefined.
  • El resultado 鈥淗ola soy Olga鈥 nos indica que aunque en el proceso de hoisting la variable name tenia el valor de undefined., al momento de ejecutarse la cuarta l铆nea (var name = 鈥淥lga鈥;) este valor de name cambi贸 a 鈥Olga鈥, declarada en el scope local, por lo que al ejecutar el console.log se obtiene ese resultado.
  • En el ultimo resultado vemos que el console.log del final nos muestra 鈥渉ola soy Bere鈥 ya que el valor de la variable name que toma es el que se declar贸 al inicio, es decir en el scope global.

Hoisting

  • Sucede de ECMAScript 5 para abajo.
  • Ocurre con var y function. Se corrigi贸 con let y const en ECMAScript 6.

El hoisting consiste en que una variable o funci贸n se ejecute antes que cualquier otro bloque de c贸digo.

console.log(miNombre);

var miNombre = "Jesus";

Aqu铆 ocurre hoisting porque se est谩 llamando una variable que, al momento en que se llama, no tiene ning煤n valor. La consola arroja undefined. JavaScript le agrega el valor undefined a la variable miNombre, y luego hace el console.log

Tambi茅n se puede generar hoisting con funciones:

hola();

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

var nombre = "Jesus";

En este caso, la consola muestra Hola undefined. JavaScript lee todas las funciones primero, sin importar donde est茅n declaradas, por lo que al invocarla si o si se ejecutar谩. Por otra parte, el undefined sigue ocurriendo por el hoisting del caso previo, donde la variable nombre no fue inicializada y JavaScript se encarga de darle el valor undefined por defecto.

Nota: Por buenas pr谩cticas, se deben declarar las funciones al inicio del c贸digo.

(Min 4:00) Va a salir 鈥淒iego鈥 recuerdo una clase del curso gratis de programaci贸n que JavaScript guarda todo y despu茅s comienza a ejecutar

Los ejemplos con c贸digo en la consola
Ah铆 lo copian y modifican a su gusto

  • Variables
> var miNombre = undefined;
  console.log(miNombre);
  miNombre = "Diego";
  undefined
<-"Diego"
> var miNombre = undefined;
  console.log(miNombre + "Soy ese hoisting");
  miNombre = "Diego";
  undefinedSoy ese hoisting
<-"Diego"

  • Funciones
> hey();
  function hey() {
		console.log("Hola " miNombre);
  }
  var miNombre = "Diego"
x Uncaught SyntaxError: ...
> hey();
  fuction hey() {
		console.log("Hola " + miNombre);
  }
  var miNombre = "Diego"
  Hola undedined
<-undefined

Aqui les dejo un peque帽o aporte de un libro que estoy leyendo junto a los cursos de platzi

We can be tempted to look at var a = 2; as one statement, but the JavaScript engine does not see it that way. It sees var a and a = 2 as two separate statements, the first one a compiler-phase task, and the second one an execution-phase task.
What this leads to is that all declarations in a scope, regardless of where they appear, are processed first before the code itself is executed. You can visualize this as declarations (variables and functions) being 鈥渕oved鈥 to the top of their respective scopes, which we call hoisting.
Declarations themselves are hoisted, but assignments, even assign鈥 ments of function expressions, are not hoisted.
Be careful about duplicate declarations, especially mixed between normal var declarations and function declarations鈥攑eril awaits if you do!

Kyle Simpson - Scope & Closures

Hoisting es cuando las variables y funciones se procesan antes de ejecutar cualquier tipo de codigo
en otras palabras seria cuando llamamos una funci贸n o variable antes de declararla.

Lo entend铆 ha la primera pens茅 que seria mas dificil xd

Te dira que la variable que estas llamando en el console.log no existe.

te sale un error de no existir est谩 variable a imprimir, puesto que se debe ser declarada antes de su uso.

Hablando de hoisting, es importante saber que en este lenguaje, una variable puede ser declarada despu茅s de ser usada. S铆, 隆esto significa que se puede usar una variable antes de declararla!