Variables y constantes

Guardar información en nuestro código


En javascript es muy sencillo declarar y utilizar variables, pero aunque sea un procedimiento simple, hay que tener una serie de conceptos previos muy claros antes de continuar para evitar futuras confusiones, sobre todo si estamos acostumbrados a otros lenguajes más tradicionales.

Variables

En programación, las variables son espacios o «compartimentos» donde se puede guardar información y asociarla a un determinado nombre al que haremos referencia durante el programa. De esta forma, cada vez que se consulte ese nombre posteriormente, te devolverá la información que contiene. La primera vez que se realiza este paso se suele llamar inicializar una variable.

Inicialización

En Javascript, utilizaremos la palabra clave let para inicializar variables. Si una variable no se inicializa con un valor concreto, contendrá un valor especial llamado undefined, que significa que su valor no está definido aún, o lo que es lo mismo, que no contiene información:

let a;          // Declaramos una variable con nombre "a", pero no le asociamos contenido.
let b = 0;      // Declaramos una variable con nombre "b", y le asociamos el número 0.

console.log(b); // Muestra 0 (el valor guardado en la variable "b")
console.log(a); // Muestra "undefined" (no hay valor guardado en la variable "a")

Como se puede observar, hemos utilizado console.log() para consultar la información que contienen las variables indicadas.

OJO: Las mayúsculas y minúsculas en los nombres de las variables de Javascript importan. No es lo mismo una variable llamada precio que una variable llamada Precio, pueden contener valores diferentes.

Si tenemos que declarar muchas variables consecutivas, una buena práctica suele ser escribir sólo el primer let y separar por comas las diferentes variables con sus respectivos contenidos (método 3). Aunque se podría escribir todo en una misma línea (método 2), con el último método el código es mucho más fácil de leer:

// Método 1: Declaración de variables de forma independiente
let a = 3;
let c = 1;
let d = 2;

// Método 2: Declaración masiva de variables en el mismo let
let a = 3, c = 1, d = 2;

// Método 3: Igual al anterior, pero mejorando la legibilidad del código
let a = 3,
    c = 1,
    d = 2;

Antiguamente, en Javascript se utilizaba la palabra clave var para inicializar variables. Aunque te lo puedes encontrar o pueden existir situaciones donde puede ser útil, hoy en día no tiene demasiado sentido utilizar var en nuestro código.

Reasignación

Como su propio nombre indica, una variable puede variar su contenido, ya que aunque contenga una cierta información, se puede volver a cambiar. A esta acción ya no se le llamaría «inicializar» una variable, sino «redeclarar» o «reasignar» una variable, ya que le estamos cambiando su contenido. En el código se puede diferenciar porque se omite el let (la variable ya existe):

// Inicializamos la variable "a" al valor 40.
let a = 40;

// Ahora, hemos redeclarado la variable a, que pasa a contener 50 en lugar de 40.
a = 50;

Constantes

En ECMAScript 2015 se añade la palabra clave const, que permite crear «compartimentos» similares a una variable, salvo que los valores que contiene no pueden ser modificados. Esto tiene varios matices, así que vamos a explicarlo poco a poco. Observa el siguiente ejemplo:

const name = "Manz";
console.log(name);

name = "Paco";  // Uncaught TypeError: Assignment to constant variable.

Como puedes ver, la diferencia respecto al let es que const asigna un valor y no permite reasignarlo o redeclararlo posteriormente. Además, tampoco puedes crear una constante sin indicarle un valor concreto:

const surname;  // Uncaught SyntaxError: Missing initializer in const declaration

En Javascript, es muy habitual declarar las variables con const para anunciar implícitamente que esos valores no cambiarán a lo largo del programa, y en el caso que tengamos intenciones de que cambien, declararlas con let. En esos casos, se suele utilizar camelCase como estrategia de nombrado.

Existen ciertos casos en los que se suele utilizar SNAKE_UPPER_CASE, y es en la situación en las que tenemos constantes con valores que no van a cambiar durante el programa, pero que el programador estará cambiando continuamente durante el desarrollo del programa para ajustar cambios. Estas constantes se suelen declarar al principio del programa, para que sea más sencillo encontrarlas y tenerlas en cuenta.

const MAX_ITERATIONS = 10;

for (let i = 0; i < MAX_ITERATIONS; i++) {
  console.log("Iteración número ", i);
}

console.log("Bucle finalizado.");

Observa que en este caso, si tuvieramos que cambiar el número de iteraciones del bucle, en lugar de tener que modificar el código del programa, sólo tendríamos que modificar la constante inicial.

No hay que confundir constantes con valores inmutables, ya que como veremos más adelante, algunas constantes (objetos, arrays...) si que pueden ser alteradas, aunque nunca reasignadas.

¿Quién soy yo?

Soy Manz, vivo en Tenerife (España) y soy streamer partner en Twitch y profesor. Me apasiona el universo de la programación web, el diseño y desarrollo web y la tecnología en general. Aunque soy full-stack, mi pasión es el front-end, la terminal y crear cosas divertidas y locas.

Puedes encontrar más sobre mi en Manz.dev