¿Cuál es el uso de let & const en JavaScript?

En este artículo, vamos a discutir el uso de let y const en JavaScript .

let: Es una palabra clave para declarar variables en JavaScript que tienen un alcance de bloque, es decir, permite declarar una variable dentro de un bloque o dentro de una expresión en lugar de en todo el documento.

Sintaxis:

let variable_name = value;

El siguiente es un ejemplo (no ejecutable) de la sintaxis ilustrada anteriormente:

let name = "GeeksforGeeks";

Característica:

• Las variables declaradas con let no se pueden volver a declarar en JavaScript. Esto significa que si una variable se declara con let, entonces no podemos volver a declarar la misma variable en el mismo contexto.

Ejemplo 1: Obtenemos un error de sintaxis ya que x no se puede volver a declarar en el mismo ámbito.

<script> 
  let x = "GeeksforGeeks";
 
  // Redeclaring same variable
  let x = 12;   
 
  console.log(x);
</script>

Producción:

SyntaxError: Identifier 'x' has already been declared

Nota: let permite declarar la misma variable dentro de un alcance de bloque { } pero no se puede usar fuera del alcance de bloque.

Ejemplo 2:

<script>
  {
    let x = 12;
  }
 
  console.log(x);
</script>

Producción:

ReferenceError: x is not defined

Ejemplo 3:

<script>
  let x = "GeeksforGeeks";
 
  {
    let x = 12;   // local variable
  }
  // x takes value of the Global Variable x
  console.log(x);
</script>

Producción:

GeeksforGeeks

Ejemplo 4: Podemos declarar una variable let dentro de un ámbito de bloque , que será tratada como una variable local dentro del ámbito de bloque y se le dará más preferencia que una variable global previamente definida.

<script>
  let x = "GeeksforGeeks";
  let y = "Computer science portal";
 
  {
    let x = 12;
    console.log(x);
    console.log(y);
  }
     console.log(x);
</script>

Producción:

12
Computer science portal
GeeksforGeeks

Ejemplo 5: un punto clave es cuando una variable se declara con let , se aloja en la parte superior del bloque pero no se inicializa. Entonces, si usamos una variable let antes de declarar la variable, obtendremos un error de referencia .

<script>
  x = "A variable"
 
  let x = "GeeksforGeeks";
 
  console.log(x);
</script>

Producción:

ReferenceError: Cannot access 'x' before initialization

Ejemplo-6: En este ejemplo, visualizaremos cómo escribir la variable let tanto dentro como fuera del alcance de la función.

let name = "GeeksforGeeks";
function displayName(){
    let prefix = "Hi!"
    console.log(prefix + " " + name);
}
displayName();
 
// This code is contributed by Aman Singla....

Producción:

Hi! GeeksforGeeks

const: también es una palabra clave para declarar variables que tienen un alcance de bloque, pero las variables declaradas por la palabra clave const no se pueden actualizar dentro del mismo alcance. Al igual que las variables let , las variables const no se pueden volver a declarar ni se puede acceder a ellas antes de que se declaren.

Sintaxis:

const x = 12;

Característica:

•  Las variables declaradas por la palabra clave const siguen siendo las mismas dentro del mismo ámbito o dentro de un bloque.

Ejemplo 1:

<script> 
  const x = 12;
  x = "GeeksforGeeks";
 
  console.log(x);
</script>

Producción:

TypeError: Assignment to constant variable.

Ejemplo 2: las variables constantes se pueden declarar como una variable local dentro de un ámbito de bloque, y la preferencia por una variable local es mayor que una variable global dentro de un ámbito de bloque.

<script>
   const x = 12;          // Global variable
   const y = "Welcome";   // Global variable
   {
       const x = "GeeksforGeeks";   // local variable
     
       // Expected output: GeeksforGeeks
       console.log(x);
     
       // Expected output: Welcome
       console.log(y);   
   }
 
   // Expected output: 12
   console.log(x);
</script>

Producción:

GeeksforGeeks
Welcome
12

Ejemplo 3: si tratamos de declarar un objeto usando la palabra clave const , entonces el objeto no se puede actualizar, pero las propiedades del objeto aún se pueden actualizar.

<script> 
 const obj = {
      name: "GeeksforGeeks",
      message: "A computer science portal"
  }
 
  // Updating properties of obj
  obj.message = "Welcome to GeeksforGeeks";
 
  console.log(obj.name);
  console.log(obj.message);
</script>

Producción:

GeeksforGeeks
Welcome to GeeksforGeeks

Ejemplo 4: similar a let, un objeto const debe inicializarse antes de la declaración. Si no está inicializado, obtendremos un error de referencia .

<script> 
  x = "Welcome to GeeksforGeeks"
  const x = 12;
 
  console.log(x);
</script>

Producción:

ReferenceError: Cannot access 'x' before initialization

Ejemplo-5: En este ejemplo, visualizaremos cómo usar variables declaradas usando la palabra clave const dentro y fuera del alcance de la función.

const name = "GeeksforGeeks";
function displayName(){
    const prefix = "Hi!"
    console.log(prefix + " " + name);
}
displayName();

Producción:

Hi! GeeksforGeeks

Diferencia clave: vemos que una variable declarada con la palabra clave let se puede reasignar, mientras que una variable declarada con la palabra clave const nunca se puede reasignar dentro del mismo ámbito.