constante de JavaScript

Tabla de contenido

ECMAScript 2015 (ES6)

En 2015, JavaScript introdujo una nueva palabra clave importante: const.

Se ha convertido en una práctica común declarar matrices usando const:

Ejemplo

const cars = ["Saab", "Volvo", "BMW"];

Pruébelo usted mismo →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript const</h2>
<p id="demo"></p>

<script>

const cars = ["Saab", "Volvo", "BMW"];
document.getElementById("demo").innerHTML = cars;

</script>
</body>
</html>

No se puede reasignar

Una matriz declarada con const no se puede reasignar:

Ejemplo

const cars = ["Saab", "Volvo", "BMW"];
cars = ["Toyota", "Volvo", "Audi"];    // ERROR

Pruébelo usted mismo →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript const</h2>

<p>You can NOT reassign a constant array:</p>

<p id="demo"></p>

<script>
try {
  const cars = ["Saab", "Volvo", "BMW"];
  cars = ["Toyota", "Volvo", "Audi"];
}
catch (err) {
  document.getElementById("demo").innerHTML = err;
}
</script>

</body>
</html>

Las matrices no son constantes

La palabra clave const es un poco engañosa.

NO define una matriz constante. Define una referencia constante a una matriz.

Debido a esto, aún podemos cambiar los elementos de una matriz constante.

Los elementos se pueden reasignar

Puedes cambiar los elementos de una matriz constante:

Ejemplo

// You can create a constant array:
const cars = ["Saab", "Volvo", "BMW"];

// You can change an element:
cars[0] = "Toyota";

// You can add an element:
cars.push("Audi");

Pruébelo usted mismo →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript const</h2>

<p>Declaring a constant array does NOT make the elements unchangeable:</p>

<p id="demo"></p>

<script>
// Create an Array:
const cars = ["Saab", "Volvo", "BMW"];

// Change an element:
cars[0] = "Toyota";

// Add an element:
cars.push("Audi");

// Display the Array:
document.getElementById("demo").innerHTML = cars; 
</script>

</body>
</html>

Soporte del navegador

La palabra clave const no se admite en Internet Explorer 10 o versiones anteriores.

La siguiente tabla define las primeras versiones del navegador con soporte completo para la palabra clave const:


Chrome 49	IE 11 / Edge	Firefox 36	Safari 10	Opera 36
Mar, 2016	Oct, 2013	Feb, 2015	Sep, 2016	Mar, 2016

Asignado cuando se declara

A las variables JavaScript const se les debe asignar un valor cuando se declaran: <p>Significado: una matriz declarada con const debe inicializarse cuando se declara.

Usar const sin inicializar la matriz es una sintaxis error:

Ejemplo

Esto no funcionará:

const cars;
cars = ["Saab", "Volvo", "BMW"];

Las matrices declaradas con var se pueden inicializar en cualquier momento.

Incluso puedes usar la matriz antes de declararla:

Ejemplo

Esto esta bien:

cars = ["Saab", "Volvo", "BMW"];
var cars;

Pruébelo usted mismo →

<!DOCTYPE html>
<html>
<body>
<h1>JavaScript Arrays</h1>
<h2>JavaScript Hoisting</h2>

<p id="demo"></p>

<script>

cars = ["Saab", "Volvo", "BMW"];
var cars;

document.getElementById("demo").innerHTML = cars[0];

</script>
</body>
</html>

Alcance del bloque constante

Una matriz declarada con const tiene Alcance del bloque.

No es lo mismo un array declarado en un bloque que un array declarado fuera del bloque:

Ejemplo

const cars = ["Saab", "Volvo", "BMW"];
// Here cars[0] is "Saab"
{
  const cars = ["Toyota", "Volvo", "BMW"];
 
  // Here cars[0] is "Toyota"
}
// Here cars[0] is "Saab"

Pruébelo usted mismo →

<!DOCTYPE html>
<html>
<body>
<h1>JavaScript Arrays</h1>
<h2>Declaring an Array Using const</h2>

<p id="demo"></p>

<script>
const cars = ["Saab", "Volvo", "BMW"];
// Here cars[0] is "Saab"
{  
  const cars = ["Toyota", "Volvo", "BMW"]; 
  // Here cars[0] is "Toyota"
}
// Here cars[0] is "Saab"
document.getElementById("demo").innerHTML = cars[0];
</script>

</body>
</html>

Una matriz declarada con var no tiene alcance de bloque:

Ejemplo

var cars = ["Saab", "Volvo", "BMW"];
// Here cars[0] is "Saab"
{
  var cars = ["Toyota", "Volvo", "BMW"];
 
  // Here cars[0] is "Toyota"
}
// Here cars[0] is "Toyota"

Pruébelo usted mismo →

<!DOCTYPE html>
<html>
<body>
<h1>JavaScript Arrays</h1> 
<h2>Declaring an Array Using var</h2>

<p id="demo"></p>

<script>
var cars = ["Saab", "Volvo", "BMW"];
// Here cars[0] is "Saab"
{  
  var cars = ["Toyota", "Volvo", "BMW"]; 
  // Here cars[0] is "Toyota"
}
// Here cars[0] is "Toyota"
document.getElementById("demo").innerHTML = cars[0];
</script>

</body>
</html>

Puede obtener más información sobre Block Scope en el capítulo: JavaScript Scope.

Redeclaración de matrices

Se permite redeclarar una matriz declarada con var en cualquier parte de un programa:

Ejemplo

var cars = ["Volvo", "BMW"];   // Allowed
var cars = ["Toyota", "BMW"];  // Allowed
cars = ["Volvo", "Saab"];      // Allowed

Redeclarar o reasignar una matriz a const, en el mismo ámbito o en el mismo bloque, no está permitido:

Ejemplo

var cars = ["Volvo", "BMW"];     // Allowed
const cars = ["Volvo", "BMW"];   // Not allowed
{
  var cars = ["Volvo", "BMW"];   // Allowed
  const cars = ["Volvo", "BMW"]; // Not allowed
}

Redeclarar o reasignar una matriz const existente, en el mismo ámbito o en el mismo bloque, no está permitido:

Ejemplo

const cars = ["Volvo", "BMW"];   // Allowed
const cars = ["Volvo", "BMW"];   // Not allowed
var cars = ["Volvo", "BMW"];     // Not allowed
cars = ["Volvo", "BMW"];         // Not allowed

{
  const cars = ["Volvo", "BMW"]; // Allowed
  const cars = ["Volvo", "BMW"]; // Not allowed
  var cars = ["Volvo", "BMW"];   // Not allowed
  cars = ["Volvo", "BMW"];       // Not allowed
}

Se permite redeclarar una matriz con const, en otro alcance o en otro bloque:

Ejemplo

const cars = ["Volvo", "BMW"];   // Allowed
{
  const cars = ["Volvo", "BMW"]; // Allowed
}
{
  const cars = ["Volvo", "BMW"]; // Allowed
}

Referencia de matriz completa

Para obtener una referencia completa de Array, vaya a nuestro:

Referencia completa de matrices de JavaScript.

La referencia contiene descripciones y ejemplos de todos los Array. propiedades y métodos.