JavaScript Moderno #1 | Variables y Constantes.
Tags: javascript, node
Published: 2021-10-17 02:16:05

En esta serie de posts, voy a compartir y ejemplificar algunas características "modernas" de JavaScript; ya que desde mi punto de vista, el conocer las features modernas de este lenguaje te hacen la vida mucho más fácil. 

En esta primera entrega vamos a ver un tema básico: Variables y Constantes.

## Variables
JavaScript fue creado en un mundo completamente distinto al que vivimos actualmente (tecnológicamente hablando), tenía otros propósitos y no fue inicialmente diseñado para soportar todo lo que actualmente le delegamos. Es por eso que JavaScript ha ido evolucionando con el tiempo y naturalmente en esa "evolución" han ido quedando vestigios de su antiguo yo, un ejemplo de esto es el uso de la palabra reservada `var`.

`var` se utiliza en JavaScript para declarar una variable (un espacio en memoria para almacenar un dato), pero no respeta las nuevas características del nuevo JavaScript, como el scope de variables, o la declaración estricta de las mismas. Entonces, ¿cómo declaramos variables sin `var`? **Javascript permite declarar variables a través de la palabra reservadas `let`.**

```js
var nombre = "Joseph" // ❌ Manera incorrecta y anticuada 😫
// ---
let nombre = "Joseph León" // ✅ Forma correcta y moderna 😎
```
Esto significa que la variable identificada como "nombre" tiene un espacio en memoria reservado para el dato que le queramos asignar, y no vamos a poder declarar otra variable con el mismo identificador.

```js
let nombre = "Joseph" // ✅ Declaro una variable "nombre"

let nombre = "Joseph León" // ❌
// Declaro otra variable con el mismo identificador 
//(Esto produce un error de JavaScript).
```
Es importante entender que una "variable" representa a un dato que va a mutar con el tiempo; o sea, en algún momento, en tiempo de ejecución de nuestro programa, este va a cambiar con respecto a su valor inicial.

```js
let nombre = "Joseph" // ✅ Declaración de variable "nombre".

// -- Mucho código---

if (necesitaApellido) { // Alguna condición.
    nombre = "Joseph León" // ✅ Modificación del valor de la variable.
}
console.log(nombre) // Joseph León.
```

Ahora, **¿qué pasa con los datos que no se modificación durante toda la ejecución de mi programa?** Estaremos tentados a seguir usando `var`; es más, esto funcionaría sin problemas, pero no es lo mejor...

## Constantes
Las constantes en JavaScript con técnicamente variables con una particularidad: **Su valor no pues cambiarse a través de la reasignación.**
Esto es muy útil, su uso permite al intérprete de JavaScript optimizar memoria y ayuda al desarrollador a identificar errores lógicos.

```js
const nombre = "Joseph" // ✅ Declaración de una constante.
nombre = "Joseph León" // ❌ Reasignación de una constante.
//(Esto produce un error de JavaScript).
```
Es necesario inicializar la constante, no es posible declararla sin asignar ningún valor.
```js
const nombre // ❌ Costante no inicializada.
//(Esto produce un error de JavaScript).
```

## Scope de variables o constantes
Si declaramos variables con `let` o `const` podemos disfrutar de una magnífica característica añadida a JavaScript que otros lenguajes ya tienen: **el scope.**

El scope de variables permiten que podamos declarar una variable o constante que exista dentro de un bloque de código (dentro de un for, while, if, etc.).

Veamos un ejemplo utilizando `var`

```js
var texto = "Hola mundo..." // Declaramos una variable y la inicializamos.

// -- Mucho código---

if (tieneComentarios) {
   var texto = "Me gusta el texto" // Declaramos otra variable para guardar el comentario.
   console.log(texto) // Imprimimos el comentario.
}

console.log(texto) // Imprimimos el texto.

/* Output:
   Me gusta el texto (✅ Se imprime el comentario. correctamente).
   Me gusta el texto (❌ Se imprime el comentario nuevamente.
   Pero qué rayos! 🤬.
*/
```

Como puedes ver, las variables declaradas con `var` no respetan el scope de un determinado bloque (en este caso `if`) modificando la variable text global.

Veamos el mismo caso utilizando `const`.

```js
const texto = "Hola mundo..." // Declaramos una constante y la inicializamos.

// -- Mucho código---

if (tieneComentarios) {
   const texto = "Me gusta el texto" // Declaramos otra constante para guardar el comentario.
   console.log(texto) // Imprimimos el comentario.
}

console.log(texto) // Imprimimos el texto.

/* Output:
   Me gusta el texto (✅ Se imprime el comentario. correctamente).
   Hola mundo... (✅ Se imprime el texto)
*/
```
Ahora el programa funciona como queremos, ya que la constante `texto` que se encuentra dentro de la estructura de control `if` solo existe en ese ámbito y no modifica a la variable global del mismo nombre. Cabe resaltar que esto funcionaría de la misma manera su hubiésemos utilizado `let`, utilizar `const` o `let` depende exclusivamente de la mutabilidad o inmutabilidad del dato.

## Conclusiones
* No utilices `var`.
* `const` para constantes.
* `let`para variables.
* Ahora disfruta del scope!