Variables con const e Inmutabilidad en JavaScript
Entiende la diferencia entre reasignación e inmutabilidad, cómo usar const correctamente y por qué debe ser tu elección por defecto.
TL;DR - Resumen rápido
- const NO permite reasignar la variable, pero el contenido de objetos/arrays SÍ puede cambiar
- Inmutabilidad y reasignación son conceptos diferentes - const solo previene reasignación
- Los objetos y arrays con const son mutables - puedes cambiar propiedades y elementos
- Object.freeze() congela objetos pero es shallow (superficial), no profundo
- const debe inicializarse al declararse - no puedes declarar sin asignar valor
- const tiene block scope y Temporal Dead Zone, igual que let
- Usa const por defecto para todo, cambia a let solo si necesitas reasignar
¿Qué es const?
const es la forma recomendada de declarar variables en JavaScript moderno, introducida en ES6 (2015) junto con let. El nombre viene de "constant" (constante), pero es importante entender que const NO hace que el valor sea inmutable - solo previene que reasignes la variable a un nuevo valor. Esta distinción es crucial y causa mucha confusión entre desarrolladores que están aprendiendo JavaScript.
const comparte muchas características con let: tiene block scope, Temporal Dead Zone, y no permite re-declaración. La diferencia principal es que const no permite reasignación - una vez que asignas un valor a una variable const, no puedes hacer que esa variable apunte a otro valor. Sin embargo, si el valor es un objeto o array, puedes modificar sus propiedades o elementos sin problemas.
Por Qué const es la Recomendación
Usar const por defecto hace tu código más fácil de entender y mantener. Cuando ves const, sabes que esa variable siempre apuntará al mismo valor/objeto. Cuando ves let, sabes que debes prestar atención porque esa variable cambia. Esta distinción visual hace el código más legible y previene bugs de reasignación accidental.
No Permite Reasignación
La característica principal de const es que no permite reasignar la variable. Si intentas asignar un nuevo valor a una variable const, obtienes un TypeError inmediatamente. Esto protege contra errores accidentales donde sobrescribes una variable que no debería cambiar.
El ejemplo muestra que una vez declarada una variable const, no puedes hacer que apunte a un valor diferente. Con let, puedes reasignar libremente. Este comportamiento de const es especialmente útil para valores que representan configuraciones, constantes matemáticas, referencias a elementos del DOM, o cualquier valor que conceptualmente no debería cambiar durante la ejecución del programa.
Protección Automática
Esta protección es a nivel del lenguaje - no necesitas linters o herramientas adicionales. Si alguien intenta reasignar una const, el error aparece inmediatamente en el navegador o Node.js. Esto hace más fácil detectar bugs donde accidentalmente sobrescribes una variable importante, especialmente en archivos grandes o código con múltiples desarrolladores.
Inmutabilidad vs Reasignación: La Confusión Común
El error de concepto más común con const es pensar que hace los valores inmutables. NO es así. const solo previene la reasignación de la variable, pero si el valor es un objeto o array, puedes modificar su contenido libremente. La variable siempre apunta al mismo objeto, pero ese objeto puede cambiar internamente.
Objetos y Arrays con const son Mutables
Cuando declaras un objeto o array con const, puedes modificar sus propiedades o elementos sin ningún problema. Lo que no puedes hacer es reasignar la variable para que apunte a un objeto/array completamente diferente.
Este comportamiento sorprende a muchos desarrolladores. const user previene que reasignes user a otro objeto, pero no previene que modifiques las propiedades del objeto actual. La variable user siempre apunta al mismo objeto en memoria, pero ese objeto puede cambiar. Lo mismo aplica para arrays: no puedes reasignar el array, pero sí puedes agregar, eliminar o modificar elementos. Esto es porque const protege la referencia, no el contenido.
Concepto Clave: Referencias
const protege la REFERENCIA al objeto/array, no su contenido. La variable siempre apunta a la misma posición de memoria, pero los datos en esa posición pueden cambiar. Piensa en const como una etiqueta pegada a una caja: no puedes cambiar a qué caja apunta la etiqueta, pero sí puedes cambiar lo que hay dentro de la caja.
Object.freeze() para Inmutabilidad Real
Si realmente quieres que un objeto sea inmutable (que no se puedan modificar sus propiedades), necesitas usar Object.freeze(). Esto congela el objeto haciendo todas sus propiedades de solo lectura. Sin embargo, Object.freeze() es shallow (superficial) - solo congela el primer nivel de propiedades.
Object.freeze() convierte todas las propiedades del objeto en no modificables. Si intentas cambiar una propiedad en modo estricto, obtienes un TypeError. Sin modo estricto, la modificación simplemente falla silenciosamente. El problema es que freeze es superficial: si tu objeto tiene propiedades anidadas (objetos dentro de objetos), esas propiedades anidadas NO están congeladas. Para congelar profundamente necesitas una función recursiva o librerías especializadas.
Inmutabilidad en JavaScript
JavaScript no tiene inmutabilidad incorporada como otros lenguajes. Object.freeze() es la herramienta nativa más cercana, pero tiene limitaciones. Si necesitas inmutabilidad real y profunda, considera patrones funcionales (crear nuevos objetos en lugar de modificar existentes) o librerías como Immer que facilitan trabajar con datos inmutables.
Inicialización Obligatoria
A diferencia de var y let, no puedes declarar una variable const sin inicializarla. Debes asignarle un valor en el momento de la declaración. Esto tiene sentido porque si no puedes reasignar const, una variable sin valor inicial nunca podría tener un valor.
JavaScript lanza un SyntaxError si intentas declarar const sin valor inicial, incluso antes de ejecutar el código. Con let y var puedes declarar primero y asignar después, pero const requiere que hagas ambas cosas en la misma sentencia. Esto fuerza buenas prácticas: si usas const, debes saber el valor en el momento de declaración, lo que hace el código más claro y predecible.
Block Scope y Temporal Dead Zone
const tiene exactamente el mismo comportamiento que let respecto a scope y hoisting. Tiene block scope (solo existe dentro del bloque donde se declaró) y Temporal Dead Zone (no puedes usarlo antes de la línea de declaración).
Este comportamiento es idéntico a let. const respeta bloques (if, for, while, funciones, bloques standalone), y si intentas usar la variable antes de declararla obtienes un ReferenceError por estar en la Temporal Dead Zone. También puedes declarar const con el mismo nombre en bloques diferentes porque cada bloque es un scope independiente.
const por Defecto: La Mejor Práctica
La recomendación moderna en JavaScript es usar const por defecto para todas las variables, y solo cambiar a let cuando descubras que necesitas reasignar. Esta práctica tiene múltiples beneficios: hace el código más fácil de entender, previene bugs de reasignación accidental, y comunica la intención del código claramente.
El ejemplo muestra casos típicos donde const es apropiado: configuraciones que no cambian, funciones que siempre referencian la misma función, resultados calculados que no necesitan modificarse, y objetos que aunque su contenido cambie, la referencia no cambia. Solo usa let cuando realmente necesites reasignar la variable completa, como contadores en bucles o valores que cambian en condicionales.
Beneficios de const por Defecto
Esta práctica tiene ventajas reales: (1) El código es más fácil de entender porque const indica que la referencia no cambia, (2) Previenes errores de reasignación accidental, (3) Los motores de JavaScript pueden optimizar mejor el código, (4) Los linters pueden detectar si declaraste let pero nunca reasignaste, sugiriendo usar const. Es una práctica adoptada por la mayoría de guías de estilo modernas (Airbnb, Google, Standard).
Errores Comunes con const
Aunque const es simple, hay errores comunes que cometen los desarrolladores, especialmente quienes están aprendiendo o vienen de otros lenguajes de programación con diferentes conceptos de constantes.
El primer error es intentar reasignar const, asumiendo que funcionará como let. El segundo es declarar sin inicializar, un hábito de otros lenguajes o de trabajar con var/let. El tercero es confundir const con inmutabilidad - pensar que el objeto no puede cambiar cuando sí puede. El cuarto es usar const en bucles donde necesitas un contador que cambia - ahí debes usar let. Entender estos casos te ayudará a elegir correctamente entre const y let.
const en Bucles for
No puedes usar const para el contador de un bucle for tradicional porque el contador se reasigna en cada iteración. Sin embargo, SÍ puedes usar const en bucles for...of y for...in porque cada iteración es un nuevo scope con una nueva const. Por ejemplo: for (const item of array) funciona perfectamente porque en cada vuelta del bucle se crea una nueva const item.
Resumen: const e Inmutabilidad
Características de const:
- •No permite reasignación de la variable
- •Objetos y arrays CON const SÍ son mutables (puedes cambiar su contenido)
- •Debe inicializarse al declararse - no puedes declarar sin valor
- •Block scope y Temporal Dead Zone (igual que let)
- •Object.freeze() para inmutabilidad real (pero es shallow)
Cuándo usar const:
- •Usa const por defecto para TODAS las variables
- •Configuraciones que no cambian
- •Referencias a funciones y objetos
- •Valores calculados que no necesitan reasignarse
- •Solo cambia a let si necesitas reasignar la variable completa