Publicado el Dejar un comentario

Javascript: instrucciones let y const.

Las instrucciones “let” y “const” son usadas en el lenguaje javascript para definir o declarar variables en un programa, pero se comportan de manera diferente. El código puede ser ejecutado en línea en algún sitio que lo permita como puede ser jsbin.

Instrucción let.

La instrucción “let” fue introducida en la version ES6 de Javascript. Sirve para declarar variables. Tiene las siguientes características:

  • Una variable declarada con “let” no puede ser vuelta a declarar en un mismo bloque.
  • Si una variable se define con “let”, debe ser declarada antes de usarse.
  • Las variables definidas con “let” tienen alcance de bloque.

Veamos algunos ejemplos de uso de “let”. El texto después de los dos diagonales (//) en el código muestra la respuesta que nos mostraría la consola:

/* Definición de variables con let */
let numero = 10;
let letra = 'a', letra2 = 'b';

console.log(numero); // 10
console.log(letra); // "a"
console.log(letra2); // "b"
/*
Variable declarada con let no puede ser vuelta a declarar con let
en un mismo bloque
*/
let precio = 10.00;
let precio = 20.00; //Error

/*
La segunda definición de la variable "precio" arrojaría el siguiente error:
"SyntaxError: Identifier 'precio' has already been declared"
*/
/*
Variable declarada con let si puede ser vuelta a declarar con let
en otro bloque y cada una conservará su valor.
*/
let precio = 10.00;
{
	let precio = 20.00; 
	console.log(precio); // 20
}
console.log(precio); // 10
/*
No se puede usar la variable antes de ser declarada con let.
*/
precio = 10.00; // Error
let precio = 15.00;

/*
La primera definición de precio sin let arrojaría el siguiente error:
"ReferenceError: Cannot access 'precio' before initialization"
*/
/*
Variable definida con let, sólo es válida en su bloque o
subbloques.
*/
let externo = 'externo';
{
  let interno = 'interno';
  {
    let interno2 = 'interno2';
    console.log(externo); // "externo"
    console.log(interno); // "interno"
    console.log(interno2); // "interno2"
  }
  console.log(externo); // "externo"
  console.log(interno); // "interno"
  console.log(interno2); // Error
}

/*
Al querer mostrar la variable "interno2" fuera del bloque del que se 
definió marcaría el siguiente error de variable no definida:
"ReferenceError: interno2 is not defined"
*/

Instrucción const.

La instrucción “const”, al igual que “let”, fue introducida en la versión ES6 de Javascript. Sirve para declarar o definir una variable cuyo valor no queremos que cambie. Tiene las siguientes características:

  • Variables definidas con “const” no pueden ser redeclaradas en un mismo bloque.
  • La variable declarada con “const” no puede ser reasignada.
  • El alcance de una variable definida con “const” es de bloque.

Enseguida veremos códigos de ejemplo de su uso:

/*
Variables declaradas con const no puedes ser redeclaradas en 
un mismo bloque.
*/

const numero = 10;
const numero = 30; // Error

/*
La última linea marcaría error. Marcaría que la variable 
numero ya fue definida o declarada:
"SyntaxError: Identifier 'numero' has already been declared"
*/
/*
Variables declaradas con const pueden ser redeclaradas en 
bloques distintos.
*/
const numero = 10;
{
  const numero = 20;
  console.log(numero); // 20
}
console.log(numero); // 10
/*
Variables declaradas con const no pueden ser reasignadas, 
es decir volverles a asignar un valor.
*/

const numero = 10;
numero = numero + 1; // Error

/*
Al queres asignarle un valor a la variable declarada con 
const marcaría que no s epuede asignar valor a una 
variable constante:
"TypeError: Assignment to constant variable." 
*/	
/*
Variable definida con const, sólo es válida en su bloque o
subbloques.
*/
const externo = 'externo';
{
  const interno = 'interno';
  {
    const interno2 = 'interno2';
    console.log(externo); // "externo"
    console.log(interno); // "interno"
    console.log(interno2); // "interno2"
  }
  console.log(externo); // "externo"
  console.log(interno); // "interno"
  console.log(interno2); // Error
}

/*
La última linea del código marcaría que la constante interno2 
no está definida porque está fuera del bloque en que se definió:
"ReferenceError: interno2 is not defined" 
*/	

Cuando una variable tipo objeto o arreglo (array) es definido con “const”, no puede ser reasignada, sin embargo los valores de los elementos que contiene el arreglo o las propiedades del objeto si pueden ser cambiados.

/*
Cuando una variable tipo arreglo es definida con const no puede ser
reasignada, sin embargo su contenido puede ser cambiado.
*/

const numeros = [1, 2, 3];
console.log(numeros);
numeros[0] = 5;
console.log(numeros);

/*
Cuando una variable tipo objeto es definida con const no puede ser
reasignada, sin embargo sus propiedades pueden ser cambiadas.
*/

const carro = {marca: 'Kia', color: 'gris', modelo: 2021};
console.log(carro);
carro.color = 'rojo'
console.log(carro);

/*
El código anterior arrojaría los siguientes resultados:

[1, 2, 3]
[5, 2, 3]
[object Object] {
  color: "gris",
  marca: "Kia",
  modelo: 2021
}
[object Object] {
  color: "rojo",
  marca: "Kia",
  modelo: 2021
}

*/

Se sugiere utilizar const cuando se definen funciones, objetos, arreglos y expresiones regulares.

Espero y esta entrada les sea útil. Cualquier observación o duda, déjalo en los comentarios. ¡Hasta pronto!