Uso correcto de var, let y const
Contenido del curso
Nombre y uso de las variables
Ámbito de las variables
Funciones
Clases
Optimizaciones
Cierre
Uso correcto de var, let y const
Uso correcto de var, let y const
Contenido del curso
LEONARD CUENCA
Maria Alejandra Luna Tito
Kevin Ivan Garcia Hernandez
Carina Payleman
Paulina Ignacio Sanvicente
Billy Torres
Maday Choque
Alan Dell Oso
Sandra Rosa Arroyo Paredes
Oscar Agustin Flores Arana
Brandon Lee Aguero Fernandez
Alex Condori Condori
Alex Camacho
Profesor
Reinaldo Mendoza
Irving Juárez
Karen Benites Segura
Israel Blas
Andrés Buelvas
Stiven Trujillo
Johan Sebastian
Johan Sebastian
Oscar Agustin Flores Arana
Francisco Ponce
David Elias Gatica Morales
Kyb3r Cipher
Ana Rotela Cabrera
Miguel Enrique Velásquez Millán
Daniel Andres Rojas Paredes
Clase 4: Uso correcto de var, let y const
Notas
// var var age = 28; { console.log("Valor dentro del bloque", age); // 28 var age = 29; } console.log("Valor fuera del bloque", age); // 29 age = age * 2; console.log("Valor cambiado", age); // 58 // let let age = 28; { console.log("Valor dentro del bloque", age); // error let age = 29; } console.log("Valor fuera del bloque", age); // 28 age = age * 2; console.log("Valor cambiado", age); // 56 // const const PI = 3.14159; PI = PI * 2; // error console.log("Valor cambiado", PI); // no se ejecuta
const tmb respeta el ambito de bloque, lo que no se es si es recomendable repetir el nombre de la constante en un bloque
´´´js
const age = 28;console.log("valor: ", age); { const age = 30; console.log("valor: ", age);} console.log("valor: ", age);age = age * 2; console.log("valor: ", age);
´´´
Es bueno señalar que en let respeta el ámbito de bloque, pero esto no evita que no se pueda acceder a una variable letra desde dentro de un bloque. El error que lanza aquí es que hay una variable let con el mismo nombre dentro de ese bloque, pero si la quitamos, el primer console.log podría acceder a la primer variable age que se declara en el ámbito global. Los bloques definidos por los corchetes pueden acceder a variables externas si no cuentan con una del mismo nombre, pero desde afuera no se puede acceder a las variables declaradas o inicializadas dentro de los bloques
Recomiendo este curso breve donde se explica muy clarito también las diferencias entre "var", "let" y "const" y las características a profundidad de c/u: https://platzi.com/cursos/javascript-closures-scope/
var - no respeta ambitos de bloque
let - si respeta ambitos de bloque
const - valores que no cambian NUNCA
Es importante recordar que los valores almacenados en una constante pueden cambiar por referencia, pero la constante en sí no puede ser reasignada. Ojo con eso, que es pregunta tipica de entrevistas
let age = 28 { console.log('valor dentro del bloque', age); let age = 29; }
// sale ReferenceError: Cannot access 'age' before initialization
El primer console.log no imprime el valor 28 porque ocurre un hoisting en JavaScript. El hoisting es un comportamiento donde las declaraciones de variables (pero no las asignaciones) se mueven al principio del ámbito en el que se encuentran. Debido al hoisting, la declaración de la segunda variable age se mueve al principio del bloque, por lo que cuando se ejecuta la línea 2 del console.log dentro del bloque, la variable age todavía no ha sido asignada y su valor es undefined
Me parece importante aclarar que en el ejemplo de let, cuando se llama a la variable variable global dentro del bloque y da error, es porque se está declarando otra variable con el mismo nombre dentro del bloque (después del console.log). Podríamos tranquilamente acceder al valor de una variable let declarada globalmente desde adentro de un bloque, siempre y cuando no volvamos a declararla dentro del mismo.
Exacto! Entrega un referenceError para el caso de let y const, ya que no se inizializan. En el caso de var entregaria undefined, ya que a estas su kas inicializa.
El valor dentro del bloque será siempre el que se le asigne el valor fuera del bloque imprimirá el valor del primer let y como resultado del valor cambiado será el producto de 28
Hola, veo que estas respondiendo a los ejercicios de clase, creo. Si es así, esto debería de estar en la sección de APORTES de la clase.
Alguien sabe la tipografia o theme que esta usando en el vscode??
Es una variante de AYU con Victor Mono como fuente.
Ya decia yo que me parecia ayu
let y var, aunque parezcan muy diferentes, realmente no lo son. Son exactamente lo mismo, solo que el engine de JS las trata de manera distinta. . Toma en cuenta los siguientes bloques de código
{ console.log("Value inside the block:", age); // Error ❌ let age = 22; } { console.log("Value inside the block:", age); // undefined var age = 22; }
Lo que pasa por debajo, es que cada que se crea un nuevo "bloque", se crea un nuevo contexto de ejecución, justo como el que se crea de manera global. Entonces, este contexto lo que hace es primero, agregar todas las variables y funciones en la memoria, por esta razón ocurre el hoisting. . En el ejemplo de arriba, en ambos contextos de ejecución, la variable "age" existe en memoria desde antes de que se ejecute cualquier línea de código. A esta variable se le da un valor de "undefined". Sin embargo, el engine de JS trata a las variables de manera distinta, según si fueron declaradas con let o con var. . En case de que fueron declaradas con let, el engine de JS no deja que se pueda acceder a esta variable antes de que haya sido declarada explicitamente en el código, por eso nos da un error. . En el caso de var, si nos deja acceder a esta variable, que es "undefined", por lo que no nos da ningún tipo de error.
Quisiera dar una pequeña aclaración, ya que al menos a mí me ayudó a entender mejor. "Declarar explícitamente" lo entiendo como escribir directamente:
let myVariable; ```Independientemente de si asignamos un valor o no a esa variable en esa línea. Recordemos que podría simplemente declarar una variable y asignarle un valor después. Si hacemos eso con **let**, JS por defecto interpreta el valor de esa variable como "no inicializado" si se declara con **let** o **const**. Si se declara con var, JS le asigna por defecto **undefined** a esa variable. Entonces, cuando ocurre el hosting dentro del bloque, JS mueve SÓLO las declaraciones de las variables arriba del bloque, no mueve sus valores. Entonces,  ```js { console.log('age'); let age =29; } ```es lo mismo que decir: ```js { let age; console.log(age); age = 29; } ```Asi, al ejecutar ese código, js lo ejecuta por orden; y en la linea 3, age no tiene ningun valor asignado y por lo tanto para JS es "no inicializado". Por eso sale el error. Ahora, si se hace con var: ```js { console.log(age); var age =29; } ```seria lo mismo que: ```js { var age; // age = undefined console.log(age); age =28; } ```Asi, al ejecutar la linea 3, age si tiene un valor por defecto: undefined. Por eso, se imprime el valor sin problemas.
Como recomendaciones:
Como var no tiene en cuentas los bloques o scopes, en este ejemplo imprime: 28 29 58 Primer comment en un curso 😁
Que tipografia utilizas en el editor?
// Uso de let let age1 = 28 { // Este console log imprime error. console.log('valor dentro del bloque', age1); let age1 = 29 } // Este consolo log imprime 28. console.log('valor fuera del bloque', age1) age1 = age1 * 2; // Este console log imprime 56 console.log('valor cambiado', age1)
var age = 28 { // Este console log imprime 28. console.log('valor dentro del bloque', age); var age = 29 } // Este consolo log imprime 29 console.log('valor fuera del bloque', age) age = age * 2; // Este console log imprime 58 console.log('valor cambiado', age)
¿Por qué, si la función dice "crearGato"? al asignarle otros parámetros como se ve en el código, el sistema responde y no genera error function crearGato(nombre, edad) { var perro = { nombre: nombre, edad: edad, meow: function() { return "Meow!"; } }; return perro; }
Es posible asignarle cualquier nombre de parámetro a una función en JavaScript, independientemente del nombre de la función en sí. En el código que proporcionaste, la función se llama "crearGato", pero los parámetros que recibe son "nombre" y "edad", lo que podría generar cierta confusión.
En este caso, la función "crearGato" simplemente crea un objeto "perro" (por qué quieres un perro si tu función está creando un gato) que tiene una propiedad "nombre" y "edad", y un método "meow" que retorna "Meow!". Aunque el nombre de la función es "crearGato", esto no afecta la lógica del código.
Por lo tanto, asignar los parámetros "nombre" y "edad" a la función "crearGato" no generará un error, ya que son simplemente variables que se utilizan para definir las propiedades del objeto "perro" que se está creando dentro de la función. Sin embargo, es una buena práctica nombrar los parámetros de una función de manera coherente con su propósito, para que sea más fácil de entender y mantener el código en el futuro.
El código no lo haces para ti, sino para ser leído por los demás. El código como lo tienes va a generar más preguntas por tu futuro equipo.
Mi suposición es que el primero console imprime 28, el segundo 28 tambien y el tercero el doble de 28
Imprimira:
Ejemplo de uso de var - age
Pensé que el console.log de la línea 5 no daría error y mostraría simplemente 28 ya que, si bien estamos declarando una variable age en la línea de debajo... La variable age de la línea 2 está declarada de forma global por lo que cualquiera debería poder usarla incluso si se encuentra dentro de otro bloque de código.
Por lo visto, si en el bloque de código estamos declarando una nueva variable con el mismo nombre que una variable global de fuera, dentro del bloque de código la que se usa es la que se declara dentro incluso cuando la usamos antes de la declaración en sí misma.
En otras palabras, si el código no tuviera la declaración de la variable age en la línea 6, no daría error y se imprimiría 28, pero como la tiene, ese bloque en concreto asume que el age que se está llamando en el console.log es la declarada en la línea de abajo y no el age global de fuera.
el ambito de bloque es lomismo que o entra dentro de la categoria de scope? o contexto? porque como lo entendi cuando estaba entendiendo el this en js es que var es para el contexto global y let para los scope locales, sin embargo habia entendido(la coscina del codigo se llama el canal de youtube) que estos contextos eran creados con el llamado o declaracion de una funcion, no con la instanciacion de objetos, pero lo planteado en esta clase me hace caer en cuenta que ambos, objetos y funciones son "delimitados " por {llaves} de ahi mi duda . el ambito de bloque es lomismo que o entra dentro de la categoria de scope? o contexto?