Variables en JavaScript

Las variables son componentes importantes en JavaScript ya que permiten almacenar y gestionar datos de manera eficiente. Al aprender a trabajar con variables se facilita el desarrollo de aplicaciones dinámicas y funcionales.

Dominar cómo y cuándo usar cada tipo de variable no solo es esencial para que tu código funcione, sino que es la diferencia entre escribir código confuso y anticuado, y escribir código limpio, moderno y profesional.

¿Qué son las Variables en JavaScript?

Una variable es un espacio en la memoria del ordenador al que le asignamos un nombre (una etiqueta). Dentro de esa “caja”, podemos guardar cualquier tipo de dato: un número, un texto, una lista de elementos, etc.

En JavaScript, existen tres palabras clave principales para declarar variables: var, let y const. Cada una con características específicas que se utilizan en diferentes escenarios.

// Creamos una "caja" con la etiqueta "greeting" y guardamos un texto dentro.
let greeting = "Hola, mundo!";

// Ahora podemos usar la etiqueta para acceder al valor.
console.log(greeting); // Muestra "Hola, mundo!" en la consola.

Declaración de Variables

Antes de poder utilizar una variable es necesario declararla. A partir de ES6 se introdujeron las palabras clave let y const para mejorar el manejo de variables en comparación con var.

Palabras Clave para Declarar Variables

1. const (Constante):

Piensa en const como una promesa: la etiqueta de esta caja no se volverá a asignar a una caja diferente. Una vez que declaras una constante, su referencia a un valor es permanente.

¿Cuándo usar const?: ¡Casi siempre! Deberías usar const por defecto para todas tus variables. Esto hace tu código más seguro y predecible, ya que previene reasignaciones accidentales.

// Valores que no deberían cambiar.
const appVersion = "2.5.1";
const userName = "Ana";
const PI = 3.1416;

// Si intentas reasignar una constante, JavaScript te dará un error. ¡Y eso es bueno!
// userName = "Lucía"; // TypeError: Assignment to constant variable.

2. let: Para Valores que Necesitan Cambiar:

Usa let solo cuando sabes de antemano que el valor de la variable necesitará cambiar en algún punto.

¿Cuándo usar let?: Es perfecto para contadores, puntuaciones, o cualquier valor que se actualice como resultado de una acción del usuario o un proceso del programa.

let userScore = 0;
console.log("Puntuación inicial:", userScore); // 0

userScore = userScore + 10;
console.log("Puntuación actualizada:", userScore); // 10

let currentTurn = "Player 1";
currentTurn = "Player 2"; // El valor cambia.

3. var: La Forma “Antigua” (Que Debes Evitar):

var fue la única forma de declarar variables en las versiones antiguas de JavaScript. Aunque la encontrarás en código viejo, se recomienda encarecidamente no usarla en proyectos nuevos.

¿Por qué evitar var?: Tiene un comportamiento confuso con el ámbito (scope) y el hoisting (elevación), lo que a menudo conduce a errores difíciles de rastrear. let y const fueron creados específicamente para solucionar estos problemas, ya que tienen un ámbito de bloque ({}) mucho más intuitivo.

Regla de Oro Moderna:

1. Usa const por defecto.
2. Usa let solo si necesitas reasignar la variable.
3. Evita var.

Inicialización de Variables

La inicialización de una variable consiste en asignarle un valor en el momento de su declaración. Si una variable se declara sin inicializar su valor es undefined.

Una vez que has declarado una variable o una constante puedes inicializarla asignándole un valor. Esto se logra mediante el operador de asignación (=), seguido del nombre y el valor que deseas asignarle.

let saludo;
console.log(saludo);

saludo = "Hola, mundo";
console.log(saludo);

Incluso podemos declarar y asignar múltiples variables al mismo tiempo, para esto separamos cada declaración con una coma (,).

let saludo = "Hola",
    usuario = "Pedro",
    estatus = true;

Nombres de Variables o Identificadores

Los identificadores son los nombres que asignamos a las variables y estas deben seguir ciertas reglas para ser válidos en JavaScript:

• Deben comenzar con una letra, guion bajo (_) o signo de dólar ($), no con un número.
• Pueden contener letras, números, guiones bajos o símbolos de dólar.
• Son sensibles a mayúsculas y minúsculas (variable y Variable son diferentes).
• No deben coincidir con palabras reservadas del lenguaje, como function o return.

Buenas Prácticas al Nombrar Variables

1. Usar camelCase: Esto indica el comenzar con minúscula y cada nueva palabra con mayúscula (miVariableImportante).
2. Elegir nombres descriptivos: Evitar nombres genéricos como x o data a menos que el contexto sea claro.

Al nombrar constantes y variables es fundamental elegir nombres descriptivos que reflejen claramente su propósito y función en el código. Esto ayuda a mejorar la legibilidad y comprensión del código tanto para ti como para otros desarrolladores que puedan trabajar con él en el futuro.

JavaScript y el Tipado Dinámico

JavaScript es un lenguaje de tipado dinámico. Esto significa que no necesitas especificar el tipo de dato que guardará una variable, y puedes cambiar el tipo de dato sobre la marcha.

let myData = "Este es un texto"; // myData es un string
console.log(typeof myData); // "string"

myData = 100; // Ahora es un número. ¡Válido en JavaScript!
console.log(typeof myData); // "number"

Si bien esto ofrece flexibilidad, también requiere disciplina para no mezclar tipos de datos de forma que cause errores inesperados.

Diferencias Entre Variables no Definidas y no Declaradas

Es importante distinguir entre variables no definidas y no declaradas:

• Variable no definida: Ha sido declarada pero no se le ha asignado ningún valor, por lo que su valor es undefined.
• Variable no declarada: No ha sido definida en el código, lo que provoca un error al intentar acceder a ella.

Ejemplo: variable no definida vs. no declarada:

let mensaje;

console.log(mensaje);  // Output: undefined
console.log(texto);  // Error: texto is not defined

El “Gotcha” de const: Mutabilidad

Aquí viene una de las mayores fuentes de confusión para los principiantes. Dijimos que const no se puede cambiar, ¿verdad? Más precisamente: la referencia de const no se puede cambiar. No puedes apuntar la etiqueta user a una caja nueva. Sin embargo, si el valor dentro de la caja es un objeto o un array, sí puedes cambiar las propiedades internas de ese objeto o los elementos de ese array.

Piensa en ello como una caja de ladrillos de LEGO: no puedes cambiar la caja (const), pero puedes reorganizar, añadir o quitar ladrillos de su interior.

const user = {
    name: "Carlos",
    age: 30
};

// ESTO ES VÁLIDO: Estamos modificando una propiedad DENTRO del objeto.
user.age = 31;
console.log(user.age); // 31

// ESTO NO ES VÁLIDO: Estamos intentando asignar la variable a un objeto completamente nuevo.
// user = { name: "David", age: 40 }; // TypeError: Assignment to constant variable.

Esta característica es increíblemente útil y es la razón por la que puedes usar const para objetos y arrays que necesitan ser modificados.

Conclusión

Entender las variables en JavaScript es tu primer gran paso hacia la maestría. Recuerda estas reglas para escribir código robusto y moderno:

1. Prioriza const: Hazlo tu opción por defecto. Te protegerá de errores.
2. Recurre a let: Úsalo solo cuando una variable deba ser reasignada.
3. Jubila a var: Déjalo en el pasado y aprovecha la claridad y seguridad de let y const.
4. Nombra con Intención: Tu yo del futuro (y tus compañeros de equipo) te lo agradecerá.

En el siguiente artículo abordaremos las diferencias específicas entre var, let y const, profundizando en sus características y mejores prácticas.