Constantes en JavaScript

Introducción

En este artículo, aprenderemos sobre constantes en JavaScript, su importancia y cómo utilizarlas en nuestros proyectos.

Examinaremos por qué es útil utilizar constantes y cómo pueden ayudarnos a escribir código más mantenible y menos propenso a errores.

¿Qué es una constante en JavaScript?

Una constante en JavaScript es un tipo especial de variable cuyo valor no puede ser modificado una vez que ha sido asignado. A diferencia de las variables regulares, que se pueden actualizar a lo largo de la ejecución de un programa, las constantes mantienen su valor original durante toda su vida útil.

Esto puede ser especialmente útil en situaciones en las que deseamos evitar cambios accidentales en ciertos valores, como configuraciones, ajustes o valores clave en nuestro código.

Propósito de las constantes

Las constantes se definen utilizando la palabra clave const en lugar de var o let. Al utilizar const, le estamos diciendo a JavaScript que el valor asignado a esa variable no debe cambiar.

Si intentamos cambiar el valor de una constante, se producirá un error, lo que nos permite identificar y corregir rápidamente cualquier intento de modificar accidentalmente dicho valor.

El propósito principal de las constantes es garantizar la inmutabilidad de ciertos valores en nuestro código. Al hacer que un valor sea inmutable, podemos estar seguros de que siempre se mantendrá igual y no causará errores o comportamientos inesperados en nuestro programa.

Ventajas de utilizar constantes

Hay varias ventajas en utilizar constantes en lugar de variables regulares en ciertas situaciones:

  • Evitar modificaciones accidentales: Como las constantes no pueden ser modificadas después de su asignación inicial, podemos estar seguros de que su valor permanecerá igual durante toda la ejecución del programa. Esto puede ayudar a prevenir errores y comportamientos inesperados causados por cambios accidentales en valores clave.
  • Facilitar la legibilidad del código: Al utilizar constantes para valores que no deben cambiar, estamos comunicando claramente nuestras intenciones a otros desarrolladores que puedan leer nuestro código. Esto facilita la comprensión del propósito y el flujo de nuestro programa.
  • Facilitar el mantenimiento del código: Cuando utilizamos constantes para valores clave, como configuraciones y ajustes, es más fácil realizar cambios en nuestro código sin afectar otras partes del programa. Si necesitamos cambiar un valor, solo tenemos que actualizar la declaración de la constante, en lugar de buscar y modificar múltiples instancias de dicho valor en nuestro código.

Declaración de constantes en JavaScript

Para declarar una constante en JavaScript, utilizamos la palabra clave const en lugar de var o let. Al igual que con las variables, también debemos asignar un valor inicial a la constante en el momento de la declaración.

A continuación, se explica cómo declarar constantes y se proporcionan ejemplos bien documentados.

Sintaxis para declarar constantes

La sintaxis para declarar una constante en JavaScript es la siguiente:


const nombreConstante = valorInicial;

Lenguaje del código: JavaScript (javascript)

Donde nombreConstante es el nombre que queremos darle a nuestra constante y valorInicial es el valor que queremos asignarle. Recuerda que las constantes deben ser inicializadas con un valor en el momento de la declaración, y no pueden ser modificadas después.

Declaración de una constante simple

A continuación se muestra un ejemplo de cómo declarar una constante en JavaScript y cómo intentar modificarla resultará en un error:


// Declaración de una constante
const PI = 3.14159;

// Intentar cambiar el valor de la constante producirá un error
// TypeError: Assignment to constant variable.
// PI = 3.14;

console.log('El valor de PI es:', PI);

Lenguaje del código: JavaScript (javascript)

En este ejemplo, hemos declarado una constante llamada PI y le hemos asignado el valor 3.14159. Cuando intentamos modificar el valor de PI, JavaScript genera un error, lo que nos indica que no podemos cambiar el valor de una constante.


// Declaración de constantes con diferentes tipos de datos
const SALUDO = '¡Hola, mundo!';
const YEAR_FUNDACION = 2021;
const PRECIO = 9.99;
const ES_ACTIVO = true;

// Uso de constantes en el código
console.log(SALUDO);           // Salida: ¡Hola, mundo!
console.log(YEAR_FUNDACION);    // Salida: 2021
console.log(PRECIO);           // Salida: 9.99
console.log(ES_ACTIVO);        // Salida: true

Lenguaje del código: JavaScript (javascript)

En este segundo ejemplo, hemos declarado varias constantes con diferentes tipos de datos, como cadenas de texto, números y valores booleanos. Luego, utilizamos console.log() para mostrar el valor de cada constante en la salida del programa.

Estos ejemplos demuestran cómo declarar constantes en JavaScript y cómo utilizarlas en nuestro código. Recuerda que las constantes no pueden ser modificadas una vez que han sido asignadas, lo que nos ayuda a garantizar la inmutabilidad de ciertos valores en nuestro programa.

Constantes y ámbito (scope) en JavaScript

El ámbito (scope) en JavaScript se refiere al contexto en el que una constante o variable está definida y es accesible. Las constantes en JavaScript tienen un ámbito de bloque, lo que significa que solo son accesibles dentro del bloque de código en el que están declaradas.

A continuación, se analiza el ámbito de las constantes y se proporcionan ejemplos bien documentados.

Ámbito global y local

Las constantes pueden tener un ámbito global o local, dependiendo de dónde se declaren en el código.

  • Ámbito global: Cuando una constante se declara fuera de cualquier bloque de código o función, tiene un ámbito global. Esto significa que es accesible desde cualquier parte del código.
  • Ámbito local: Cuando una constante se declara dentro de un bloque de código o función, tiene un ámbito local. Esto significa que solo es accesible dentro de ese bloque de código o función.

Comparación entre constantes, variables y ámbito

A diferencia de las variables declaradas con var, que tienen un ámbito de función, las constantes (al igual que las variables declaradas con let) tienen un ámbito de bloque.

Esto significa que las constantes y variables let son accesibles solo dentro del bloque en el que están declaradas, mientras que las variables var son accesibles en toda la función en la que están declaradas.

Ejemplo práctico

Ámbito global y local de constantes en JavaScript


// Declaración de una constante global
const GLOBAL_CONST = "Soy una constante global";

function ejemploScope() {
  // Declaración de una constante local dentro de una función
  const LOCAL_CONST = "Soy una constante local";

  console.log(GLOBAL_CONST); // Salida: Soy una constante global
  console.log(LOCAL_CONST);  // Salida: Soy una constante local
}

ejemploScope();

// Accediendo a las constantes fuera de la función
console.log(GLOBAL_CONST);   // Salida: Soy una constante global
// console.log(LOCAL_CONST);  // Error: LOCAL_CONST is not defined

Lenguaje del código: JavaScript (javascript)

En este ejemplo, hemos declarado una constante global (GLOBAL_CONST) y una constante local (LOCAL_CONST). La constante global es accesible tanto dentro como fuera de la función ejemploScope(), mientras que la constante local solo es accesible dentro de la función.

Intentar acceder a LOCAL_CONST fuera de la función resultará en un error, ya que su ámbito está limitado al bloque de código de la función.

Estos ejemplos demuestran cómo el ámbito de las constantes en JavaScript se ve afectado por su ubicación en el código. Comprender el ámbito de las constantes es crucial para evitar errores y garantizar que nuestro código sea fácil de leer y mantener.

Constantes y tipos de datos en JavaScript

En JavaScript, las constantes pueden almacenar diferentes tipos de datos, como tipos de datos primitivos (string, number, boolean) y tipos de datos compuestos (object, array).

A continuación, se exploran constantes con diferentes tipos de datos y se proporcionan ejemplos bien documentados.

Constantes y tipos de datos primitivos

Los tipos de datos primitivos en JavaScript incluyen string (cadenas de texto), number (números) y boolean (valores verdadero o falso). Las constantes pueden almacenar cualquiera de estos tipos de datos primitivos.

Ejemplo de constantes con tipos de datos primitivos:


const NOMBRE = "Juan Pérez";
const EDAD = 30;
const ES_ESTUDIANTE = false;

console.log("Nombre:", NOMBRE);             // Salida: Nombre: Juan Pérez
console.log("Edad:", EDAD);                 // Salida: Edad: 30
console.log("¿Es estudiante?:", ES_ESTUDIANTE); // Salida: ¿Es estudiante?: false

Lenguaje del código: JavaScript (javascript)

En este ejemplo, hemos declarado y utilizado constantes que almacenan diferentes tipos de datos primitivos, como string, number y boolean.

Constantes y tipos de datos compuestos

Los tipos de datos compuestos en JavaScript incluyen object (objetos) y array (arreglos). Las constantes también pueden almacenar estos tipos de datos compuestos.

Ejemplo de constantes con objetos:


const PERSONA = {
  nombre: "María Rodríguez",
  edad: 25,
  esEstudiante: true
};

console.log("Nombre:", PERSONA.nombre);         // Salida: Nombre: María Rodríguez
console.log("Edad:", PERSONA.edad);             // Salida: Edad: 25
console.log("¿Es estudiante?:", PERSONA.esEstudiante); // Salida: ¿Es estudiante?: true

Lenguaje del código: JavaScript (javascript)

En este ejemplo, hemos declarado una constante que almacena un objeto con tres propiedades: nombre, edad y esEstudiante. Luego, accedemos a las propiedades del objeto utilizando la notación de puntos.

Ejemplo de constantes con arreglos:


const FRUTAS = ["manzana", "plátano", "naranja"];

console.log("Fruta 1:", FRUTAS[0]); // Salida: Fruta 1: manzana
console.log("Fruta 2:", FRUTAS[1]); // Salida: Fruta 2: plátano
console.log("Fruta 3:", FRUTAS[2]); // Salida: Fruta 3: naranja

Lenguaje del código: JavaScript (javascript)

En este ejemplo, hemos declarado una constante que almacena un arreglo de tres elementos. Luego, accedemos a los elementos del arreglo utilizando índices entre corchetes.

Estos ejemplos demuestran cómo las constantes en JavaScript pueden almacenar y trabajar con diferentes tipos de datos, tanto primitivos como compuestos. Comprender cómo utilizar constantes con diversos tipos de datos nos permite aprovechar al máximo la flexibilidad y potencia de JavaScript.

Constantes y objetos en JavaScript

Aunque las constantes en JavaScript no permiten la reasignación de su valor, cuando se trabaja con objetos, es importante tener en cuenta que las propiedades del objeto sí pueden ser modificadas.

En esta sección, exploraremos cómo funcionan las constantes con objetos y proporcionaremos ejemplos bien documentados.

Modificando propiedades de objetos constantes

Cuando una constante almacena un objeto, no se puede reasignar a otro objeto o valor. Sin embargo, las propiedades dentro del objeto pueden ser modificadas, agregadas o eliminadas.

Ejemplo de modificación de propiedades en objetos constantes:


const AUTO = {
  marca: "Toyota",
  modelo: "Corolla",
  year: 2020
};

// Modificar una propiedad del objeto
AUTO.modelo = "Camry";
console.log("Modelo modificado:", AUTO.modelo); // Salida: Modelo modificado: Camry

// Agregar una nueva propiedad al objeto
AUTO.color = "Rojo";
console.log("Color agregado:", AUTO.color); // Salida: Color agregado: Rojo

// Eliminar una propiedad del objeto
delete AUTO.year;
console.log("Propiedad 'año' eliminada:", AUTO.year); // Salida: Propiedad 'año' eliminada: undefined

Lenguaje del código: JavaScript (javascript)

En este ejemplo, hemos declarado una constante que almacena un objeto AUTO. Luego, modificamos una propiedad existente, agregamos una nueva propiedad y eliminamos una propiedad del objeto. Aunque AUTO es una constante, sus propiedades pueden ser modificadas.

Intentando reasignar un objeto constante

A pesar de que las propiedades de un objeto constante pueden ser modificadas, el objeto en sí no puede ser reasignado a otro objeto o valor. Intentar hacerlo resultará en un error.

Ejemplo de intento de reasignación de un objeto constante:


const CIUDAD = {
  nombre: "Madrid",
  país: "España"
};

// Intentar reasignar la constante a otro objeto
// TypeError: Assignment to constant variable.
// CIUDAD = {
//   nombre: "Barcelona",
//   país: "España"
// };

console.log("Nombre de la ciudad:", CIUDAD.nombre); // Salida: Nombre de la ciudad: Madrid

Lenguaje del código: JavaScript (javascript)

En este ejemplo, hemos declarado una constante que almacena un objeto CIUDAD. Luego, intentamos reasignar la constante a otro objeto, lo que provoca un error en tiempo de ejecución. Esto demuestra que no podemos reasignar un objeto constante.

Constantes y arreglos en JavaScript

En esta sección, exploraremos cómo utilizar constantes con arreglos en JavaScript. Al igual que con los objetos, es posible definir arreglos como constantes, lo que garantiza que su referencia no pueda ser modificada.

Sin embargo, es importante tener en cuenta que los elementos del arreglo en sí aún pueden cambiar, a menos que tomemos precauciones adicionales.

Declaración de arreglos constantes

Para declarar un arreglo constante en JavaScript, utilizamos la palabra clave const seguida del nombre de la constante, en mayúsculas y separado por guiones bajos para facilitar su lectura. Luego, asignamos un arreglo al nombre de la constante usando la sintaxis de corchetes [].


const FRUITS = ['apple', 'banana', 'cherry'];

Lenguaje del código: JavaScript (javascript)

Inmutabilidad y arreglos constantes

Aunque la referencia al arreglo es constante e inmutable, los elementos dentro del arreglo aún pueden ser modificados.

Veamos un ejemplo:


const FRUITS = ['apple', 'banana', 'cherry'];
console.log(FRUITS); // ['apple', 'banana', 'cherry']

FRUITS[1] = 'orange';
console.log(FRUITS); // ['apple', 'orange', 'cherry']

Lenguaje del código: JavaScript (javascript)

En el ejemplo anterior, hemos cambiado el segundo elemento del arreglo FRUITS. Aunque FRUITS es una constante, sus elementos no están protegidos contra modificaciones.

Si deseamos crear un arreglo completamente inmutable, podemos utilizar el método Object.freeze(). Este método impide que se agreguen, eliminen o modifiquen elementos en un arreglo.


const FRUITS = Object.freeze(['apple', 'banana', 'cherry']);
console.log(FRUITS); // ['apple', 'banana', 'cherry']

FRUITS[1] = 'orange'; // TypeError: Cannot assign to read-only property '1' of object '[object Array]'

Lenguaje del código: JavaScript (javascript)

Ahora, si intentamos modificar algún elemento del arreglo FRUITS, JavaScript arrojará un error, ya que el arreglo está congelado y sus elementos no pueden ser modificados.

Uso de constantes con arreglos

Veamos un ejemplo práctico en el que utilizamos constantes con arreglos para almacenar una lista de colores. Luego, crearemos una función que recibe un arreglo de colores y devuelve un mensaje con el color en una posición específica.


const COLORS = Object.freeze(['red', 'blue', 'green', 'yellow', 'purple']);

function getColorMessage(colors, index) {
  if (index >= 0 && index < colors.length) {
    return `El color en la posición ${index} es ${colors[index]}.`;
  }
  return 'Índice no válido.';
}

console.log(getColorMessage(COLORS, 2)); // 'El color en la posición 2 es green.'
console.log(getColorMessage(COLORS, 5)); // 'Índice no válido.'

Lenguaje del código: JavaScript (javascript)

En este ejemplo, hemos utilizado un arreglo constante e inmutable para almacenar una lista de colores. Nuestra función getColorMessage toma como argumentos el arreglo de colores y un índice, y devuelve un mensaje con el color en la posición especificada.

Modificando elementos de arreglos constantes

A pesar de que un arreglo es una constante, sus elementos pueden ser modificados y su longitud puede cambiar mediante la adición o eliminación de elementos.

Ejemplo de modificación de elementos en arreglos constantes:


const NUMEROS = [1, 2, 3, 4, 5];

// Modificar un elemento del arreglo
NUMEROS[2] = 99;
console.log("Arreglo después de modificar el elemento:", NUMEROS);
// Salida: Arreglo después de modificar el elemento: [1, 2, 99, 4, 5]

// Agregar un elemento al final del arreglo
NUMEROS.push(6);
console.log("Arreglo después de agregar un elemento:", NUMEROS);
// Salida: Arreglo después de agregar un elemento: [1, 2, 99, 4, 5, 6]

// Eliminar el último elemento del arreglo
NUMEROS.pop();
console.log("Arreglo después de eliminar un elemento:", NUMEROS);
// Salida: Arreglo después de eliminar un elemento: [1, 2, 99, 4, 5]

Lenguaje del código: JavaScript (javascript)

En este ejemplo, hemos declarado una constante que almacena un arreglo NUMEROS. Luego, modificamos uno de sus elementos, agregamos un elemento al final del arreglo y eliminamos el último elemento. Aunque NUMEROS es una constante, sus elementos pueden ser modificados y su longitud puede cambiar.

Constantes y funciones en JavaScript

En esta sección, veremos cómo las constantes pueden utilizarse en combinación con funciones en JavaScript.

Las funciones son bloques de código reutilizables que realizan una tarea específica y, a menudo, retornan un valor. Podemos utilizar constantes para almacenar funciones y mantener su referencia inmutable.

Declaración de funciones constantes

Para declarar una función constante en JavaScript, primero necesitamos crear una función utilizando una expresión de función y luego asignarla a una constante. Al hacer esto, garantizamos que la referencia a la función no cambiará durante la ejecución del programa.

Ejemplo práctico: Creación de una función constante


// Crear una función constante que sume dos números
const suma = function(a, b) {
  return a + b;
};

// Utilizar la función constante
const resultado = suma(5, 3);
console.log(resultado); // Output: 8

Lenguaje del código: JavaScript (javascript)

En este ejemplo, hemos creado una función constante llamada suma, que toma dos argumentos, a y b, y devuelve la suma de estos dos números. Luego, llamamos a la función suma y almacenamos el resultado en la variable resultado.

Utilizar constantes como parámetros de funciones

Las constantes pueden ser utilizadas como argumentos al llamar a funciones. Esto asegura que los valores pasados a la función no sean modificados accidentalmente dentro de la función.

Ejemplo práctico:


const PI = 3.14159265359;

const calcularAreaCirculo = (radio) => {
  return PI * radio * radio;
};

console.log(calcularAreaCirculo(5)); // Output: 78.53981633974

Lenguaje del código: JavaScript (javascript)

En este ejemplo, utilizamos la constante PI como parte del cálculo del área del círculo en la función calcularAreaCirculo. Pasar constantes como argumentos a funciones asegura que la función utilice valores inmutables y evita posibles errores.

Utilizar constantes en funciones anidadas

Las constantes también pueden ser utilizadas en funciones anidadas (funciones definidas dentro de otras funciones) para mantener un valor constante a lo largo de todas las llamadas a la función anidada.

Ejemplo práctico:


const FACTOR_CONVERSION = 1.8;

const convertirTemperatura = (temperaturas, unidadDestino) => {
  const convertirCelsiusFahrenheit = (gradosCelsius) => {
    return gradosCelsius * FACTOR_CONVERSION + 32;
  };

  const convertirFahrenheitCelsius = (gradosFahrenheit) => {
    return (gradosFahrenheit - 32) / FACTOR_CONVERSION;
  };

  if (unidadDestino === 'F') {
    return temperaturas.map(convertirCelsiusFahrenheit);
  } else if (unidadDestino === 'C') {
    return temperaturas.map(convertirFahrenheitCelsius);
  }
};

const temperaturasCelsius = [0, 20, 30];
console.log(convertirTemperatura(temperaturasCelsius, 'F')); // Output: [32, 68, 86]

Lenguaje del código: JavaScript (javascript)

En este ejemplo, hemos definido una constante FACTOR_CONVERSION que se utiliza en las funciones anidadas convertirCelsiusFahrenheit y convertirFahrenheitCelsius para realizar la conversión de temperaturas.

Esto garantiza que el factor de conversión se mantenga constante e inmutable en todas las llamadas a las funciones anidadas.

Funciones puras y constantes

Las constantes son especialmente útiles cuando se trabaja con funciones puras. Las funciones puras son aquellas que no tienen efectos secundarios y siempre devuelven el mismo resultado para los mismos argumentos. Trabajar con funciones puras y constantes puede mejorar la previsibilidad y la capacidad de prueba de nuestro código.

Ejemplo práctico:


const calcularImpuesto = (monto, tasaImpuesto = 0.21) => {
  return monto * tasaImpuesto;
};

const IMPUESTO_IVA = 0.21;
const monto = 100;

const impuestoCalculado = calcularImpuesto(monto, IMPUESTO_IVA);
console.log(impuestoCalculado); // Output: 21
Lenguaje del código: JavaScript (javascript)

En este ejemplo, hemos definido una función pura llamada calcularImpuesto que calcula el impuesto basado en un monto y una tasa de impuesto. La tasa de impuesto tiene un valor predeterminado, pero también podemos pasar una constante IMPUESTO_IVA como argumento.

Al utilizar constantes y funciones puras, garantizamos que nuestro código sea más predecible y fácil de probar.

Referencias

Aquí tienes algunas referencias útiles sobre el tema de constantes en JavaScript:

  1. Mozilla Developer Network (MDN) – const: La documentación oficial de JavaScript en MDN proporciona información detallada sobre la declaración de constantes utilizando la palabra clave const.
  2. W3Schools – JavaScript const: W3Schools ofrece una introducción fácil de entender sobre el uso de constantes en JavaScript, con ejemplos y ejercicios interactivos.

Estas referencias proporcionan una base sólida para aprender y comprender las constantes en JavaScript, su propósito y cómo utilizarlas en tus proyectos.

Curso de HTML Desde Cero

Inscríbete Ahora