Lo dije un par de clases atrás, pero vuelvo a recomendar también el curso de Closures y Scope en JS porque explica todo este módulo de scopes y hoisting claro y en profundidad: https://platzi.com/cursos/javascript-closures-scope/
0:00/7:42
Lo dije un par de clases atrás, pero vuelvo a recomendar también el curso de Closures y Scope en JS porque explica todo este módulo de scopes y hoisting claro y en profundidad: https://platzi.com/cursos/javascript-closures-scope/
Conocer todas estas cuestiones de scope es esencial, pero me parece que las mismas no tienen nada que ver con el curso actual. Para aprenderlas hay otros cursos, de hecho, cursos específicos.
Hay tanto para decir de Clean Code, que ocupar tiempo en cuestiones aledañas o tangenciales me parece desafortunado.
Si este curso se adentrara en contenido mas avanzados y organizara de otra forma las clases perfectamente seria el remplazo para el curso de JS profesional, en otras palabras es mi manera de decir que este curso esta realmente bien realizado.
var greet = "Hello";
function saludar() {
console.log(greet); //> undefined
var greet = "Hi";
console.log(greet); //> Hi
}
saludar(); // se invoca la función
la variable local greet se declara en la parte superior de la función saludar(), antes de que se imprima la variable global greet. Sin embargo, en el momento en que se imprime la variable local greet, aún no se le ha asignado un valor y, por lo tanto, su valor es undefined. JavaScript, cada vez que se define una variable dentro de una función, se crea una nueva instancia de esa variable en un ámbito local dentro de la función. Es decir, la variable local greet dentro de la función saludar() se refiere a una instancia diferente de la variable greet que la variable global greet que está definida fuera de la función, es otro espacio de memoria.
Todo lo que comenta la Profesora Alejandra Camacho con respecto a las variables y su hoisting solo se aplica a las variables creadas con "var".
Con las variables creadas con "let" y "const" no sucede ese tipo de comportamientos raros y directamente saltan errores si intentamos acceder al valor de dichas variables antes de su declaración.
En resumen: No usen var, amiguitos, usen let y const ✨.
Mis apuntes de la clase
Es importante recalcar que las variables declaradas con var, a pesar de que no tienen scope de bloque, sí tienen scope de función. Por ende:
// scope de bloque:
console.log(age) // undefined
{
console.log(age) // undefined
var age = 28
}
console.log(age) // 28
// scope de función
function greet() {
console.log(greeting) // undefined
var greeting = 'Hi'
console.log(greeting) // Hi
}
console.log(greeting) // ReferenceError: greeting is not defined
Como greeting está declarada dentro de una función, se le aplicará hoisting en el ámbito léxico de la función. Mientras que age, como está declarada dentro de un bloque, se le aplicará hoisting de forma global.
Una buena practica es declarar todas las variables en la parte inicial del ambito en la que esten ? O puedo declararlas donde yo desee para asi poder visualizarlas a medida que trabajo con estas?
Pero que sucede con eso de que "var greet=" Hello"" es global ?
Carina Payleman
Lo dije un par de clases atrás, pero vuelvo a recomendar también el curso de Closures y Scope en JS porque explica todo este módulo de scopes y hoisting claro y en profundidad: https://platzi.com/cursos/javascript-closures-scope/
Alex Camacho
ProfesorExcelente recomendación, si tienen oportunidad de tomar el curso que recomienda Carina tomenlo 🙌🏻
Wladimir Rocha
Es buenisimo, nos ayuda a entender un poco mejor eso y a manejar de mejor forma los closures que en algunos casos nos podría ayudar
Diego Mario Maldini Freyre
Conocer todas estas cuestiones de scope es esencial, pero me parece que las mismas no tienen nada que ver con el curso actual. Para aprenderlas hay otros cursos, de hecho, cursos específicos.
Hay tanto para decir de Clean Code, que ocupar tiempo en cuestiones aledañas o tangenciales me parece desafortunado.
Irving Juárez
Las buenas prácticas que puedes tomar de esta clase es que uses ES6 en tu código (ósea, no uses var)
N40 M10
Si este curso se adentrara en contenido mas avanzados y organizara de otra forma las clases perfectamente seria el remplazo para el curso de JS profesional, en otras palabras es mi manera de decir que este curso esta realmente bien realizado.
Jose Gabriel Argüello
Hoisting
var greet = "Hello"; function saludar() { console.log(greet); //> undefined var greet = "Hi"; console.log(greet); //> Hi } saludar(); // se invoca la función
la variable local greet se declara en la parte superior de la función saludar(), antes de que se imprima la variable global greet. Sin embargo, en el momento en que se imprime la variable local greet, aún no se le ha asignado un valor y, por lo tanto, su valor es undefined. JavaScript, cada vez que se define una variable dentro de una función, se crea una nueva instancia de esa variable en un ámbito local dentro de la función. Es decir, la variable local greet dentro de la función saludar() se refiere a una instancia diferente de la variable greet que la variable global greet que está definida fuera de la función, es otro espacio de memoria.
Maday Choque
Jose Ever Muñoz Muñoz
muchisimas gracias por tu aclaracion estaba reconfundido
Miguel Enrique Velásquez Millán
Todo lo que comenta la Profesora Alejandra Camacho con respecto a las variables y su hoisting solo se aplica a las variables creadas con "var".
Con las variables creadas con "let" y "const" no sucede ese tipo de comportamientos raros y directamente saltan errores si intentamos acceder al valor de dichas variables antes de su declaración.
En resumen: No usen var, amiguitos, usen let y const ✨.
Ana Rotela Cabrera
Mis apuntes de la clase
Santiago Andres Alvarez Cuadros
Es importante recalcar que las variables declaradas con var, a pesar de que no tienen scope de bloque, sí tienen scope de función. Por ende:
// scope de bloque: console.log(age) // undefined { console.log(age) // undefined var age = 28 } console.log(age) // 28 // scope de función function greet() { console.log(greeting) // undefined var greeting = 'Hi' console.log(greeting) // Hi } console.log(greeting) // ReferenceError: greeting is not defined
Como greeting está declarada dentro de una función, se le aplicará hoisting en el ámbito léxico de la función. Mientras que age, como está declarada dentro de un bloque, se le aplicará hoisting de forma global.
Ariel Ezequiel Biazzo Genua
Una buena practica es declarar todas las variables en la parte inicial del ambito en la que esten ? O puedo declararlas donde yo desee para asi poder visualizarlas a medida que trabajo con estas?
Joel aravena villegas
Pero que sucede con eso de que "var greet=" Hello"" es global ?
Reinaldo Mendoza
La función es autoejecutable + hoisting, primero js inicializa greet y la funcion, pero aun no esta cargado el "Hello"
Jose Gabriel Argüello
cada vez que se define una variable dentro de una función, se crea una nueva instancia de esa variable en un ámbito local dentro de la función. Es decir, la variable local greet dentro de la función saludar() se refiere a una instancia diferente de la variable greet que la variable global greet que está definida fuera de la función, es otro espacio de memoria.
David Elias Gatica Morales
undefined
Hi
Victor R Vele
var greet = "Hello";
(() => {
console.log(greet); // Imprimirá "Hello"
greet = "Hi"; // Cambia el valor de greet en el ámbito global
console.log(greet); // Imprimirá "Hi"
})();
VM12050:4 Hello
VM12050:7 Hi
Natalia Vera Duran
Esto no pasa en python
Daniel Ochoa
Siento que a veces da las ideas correctas pero no las enmarca, por ejemplo explico super el hoist, pero no explico que era lo que estaba sucediendo en las funciones autoinvocadas y así con varios conceptos en las clases anteriores hahaha, es como que se le va el hilo, pero igual esta bien el ejemplo.
Jose Ever Muñoz Muñoz
Diego Martínez VIlla
var greet = "Hello"; function saludar() { console.log(greet); //> Hello var greet = "Hi"; console.log(greet); //> Hi } saludar(); // se invoca la función
Este es el ejemplo si la función no fuera auto invocada.
En este ejemplo los valores impresos son:
Es importante entender como se ejecuta nuestro código para saber el porque de los comportamientos.
Mauricio J Carrillo
Independientemente si la función es autoinvocada o no. En el primer console.log también te dará como resultado undefined. Es precisamente porque ambas variables tienen un ámbito diferente y por lo tanto un contexto o instancia diferente.
Al probarlo con la extensión de Run Code, me confirmó esta observación.
Maday Choque
let age = 28 { console.log('valor dentro del bloque', age); let age = 29; } console.log('valor fuera del bloque', age) age = age*2 console.log('valor cambiado', age)
Alan Vega
Es importante tomar en cuenta que en este escenario imprime undifined porque se está declarando una variable con el mismo nombre que la variable global, y esta variable declarada dentro de la función solo es accesible a nivel función, que sería lo equivalente a esto:
var greet = "Hello"; function saludar() { var greet; console.log(greet); //> undefined var greet = "Hi"; console.log(greet); //> Hi } saludar();
Pero si no es asi, si imprime el valor de la variable global:
var greet = "Hello"; function saludar() { console.log(greet); //> Hello } saludar();
Ricardo Andrey Cifuentes Martínez
Buenas prácticas para usar hoisting
No utilizar var en las declaraciones de variables.
Escribir primero las funciones y luego su invocación.
Milagros Fortis
El primer console.log va a dar 'Hello' y el segundo 'Hi'
var si tiene ambito dentro de las funciones
var siempre pertenece al ámbito global, pero hay una excepción y esa es si se ejecuta dentro de una función.
Ejemplo 1
(function(){ var greet = 'hello'; console.log(greet);//>hello } )(); console.log(greet);//>Error: greet is no defined console.log('el programa NO continua');//no se ejecuta
Como vemos al usar *var* dentro de una función, la variable se quedara en el ámbito local de esa función y no saldrá de allí.
Ejemplo 2
var greet = 'hello global'; ( function(){ var greet = 'hello local'; console.log(greet);//>hello local } )(); console.log(greet);//>hello global ```En este ejemplo vemos que la variable \*greet\* de afuera de la funcion es una variable totalmente diferente a la variable \*greet\* de dentro de la función. Desde afuera no se sabe la existencia de la \*var greet\* de dentro de la función y desde la función no se sabe de la existencia de la \*var greet\* de afuera. **Ejemplo 3** Esto solo sucede con funciones y no funciona en casos como por ejemplo un condicional if, un bloque \*{}\*, un for, un while, etc. ```js if(true){ var greet = 'hello'; console.log(greet);//>hello } console.log(greet);//>hello