Programación

¿Cuál es la diferencia entre var, let y const?

Al principio Javascript tenía solo una manera de definir variables, y esto era usando var, esta es la manera “antigua” de declarar variables. Esta se usaba hasta que apareció en junio de 2015, ES6 y con esto let y const. Estas aparecieron para satisfacer las diferentes necesidades que han ido surgiendo, según Javascript ha ido convirtiéndose en un ecosistema más completo.

A día de hoy en JavaScript, podemos declarar una variable usando estas tres, donde respecto a funcionamiento hay una cierta diferencia entre var, let o const.

Lo que diferencia a var, let y const principalmente, es que cada una tienen un scope (alcance) y una reasignación diferente.

¿Qué es el scope en JavaScript?

El scope, es el alcance que tiene la variable, donde va a estar definida, es decir, donde podremos llamarla pudiendo acceder a su valor, modificarlo (a no ser que sea una constante), etc. En este caso en JavaScript se pueden definir variables con alcance a nivel de función y nivel de bloque.

  • Alcance funcional o global: hará que nuestra variable sea accesible siempre dentro de una función, o de manera global si no está contenida dentro de una función.
  • Alcance de bloque: la variable definida será accesible entre corchetes “{}”, como puede ser dentro de un “if”, un “for”, “funciones”. De manera que será accesible dentro del bloque pero no fuera de este.

Qué es var

Con var declaramos una variable, y opcionalmente le asignamos un valor

var nombreDeLaVariable = 'valor'

El scope de var es a nivel de función o global como hemos explicado previamente, lo que en algunos desarrollos puede supone un reto, como puedo ser al usar librerías de terceros.

Una particularidad de var es que puede ser reasignada múltiples veces, redeclarando la variable. Esto es una de las características que suponen uno de los mayores problemas al usar var para declarar variables, ya que nos va a dar la posibilidad de reescribir variables sin querer, por el hecho de que normalmente, cuando declaramos una variable, estamos pensando que es la primera vez que va a ser declarada dicha variable.

Otra particularidad de var es que nos permite utilizar una variable antes incluso de declararla.

Cuando parece que el sentido común nos dice que eso debería ser un error, obtenemos “undefined”. Esto es debido al hoisting, que no trataremos en este post, pero que de manera resumida lo que hace es elevar las declaraciones de var arriba previo a la ejecución de la función, así que cuando alcanza a la llamada, como no tiene valor asignado, imprime “undefined”.

Qué es let

Al igual que var, permite declarar e inicializar (opcionalmente) una variable con un valor.

let nombreDeLaVariable = 'valor'

A diferencia de var que permite declarar variables con alcance global o a nivel de función, let permite inicializar variables limitando su alcance a bloques. Por si el tema del alcance de bloques no ha quedado claro: por ejemplo, tenemos un bucle for, y asignamos una variable en este bucle for:

for(let i = 0, i < 10, i++) {
 Console.log(i);
}

Si tratásemos de llamar a nuestra variable “i” fuera del bucle for y ejecutar el código, obtendríamos un error advirtiéndonos que la variable no está definida

Cuando usamos let para definir una variable, solo estará definida dentro del bloque donde realicemos la definición.

Por otro lado, si tratamos de redeclarar let como se podía hacer con var, esto no va a ser posible, podemos modificar su valor, pero no redeclarar la variable. De esta forma soluciona ese inconveniente que teníamos con var de declarar una variable que ya habíamos declarado previamente.

Qué es const

Const, es muy similar a let, la principal diferencia es, que no va a permitir reasignarle un valor,  es para valores que nunca cambian, por ejemplo, si tenemos una constante (como puede ser Pi en matemáticas, 3,14159…), no podemos reasignar valor a esta (mal llamada) variable, será una constante. Hagamos la prueba:

Obtenemos el error, y es por esto mismo.

No obstante, const si nos permite cambiar las propiedades de objetos, por ejemplo, teniendo un objeto.

Esto tiene más que ver con las características propias de los objetos, pero vemos como const nos previene de reasignar el valor, pero no las propiedades de un valor.

Claves: Diferencia entre var, let y const

Const y let son muy parecidos, y por lo general se recomienda utilizar const, en vez de let, a no ser que sepas que vas a querer cambiar el valor.

Entre var y const y let, las diferencias son el scope, que es mucho más amplio en var.

Veamos una tabla con las principales diferencias:

varletconst
scope (alcance)funcional o globalde bloquede bloque
redeclararnono
redefinir valorno

Cuando usar var, let y const

Por lo general, y en lo relacionado con cómo usarlo, se recomienda utilizar const, en vez de let, a no ser que sepas que se vaya a modificar el valor de la variable.

En cuanto al uso de var, en general no se recomienda, no se considera mala práctica en absoluto, pero se recomienda usar solo si para el desarrollo se ha considerado antes const y let y se hace decidido que var puede ser una mejor opción.

En prácticas modernas de desarollo web, es recomendable usar let y const como comentábamos arriba.

David Boo

Entradas recientes

Presupuesto de rastreo o Crawl Budget: ¿Qué es y cómo mejorarlo?

En esta guía práctica, te explicamos qué es el presupuesto de rastreo, por qué es… Leer más

3 días hace

Qué es el call to action (CTA) y cómo hacer uno efectivo

¿Alguna vez te has encontrado con un mensaje que te invita a actuar, ya sea… Leer más

1 semana hace

¿Qué es una promesa en JavaScript? Todo lo que necesitas saber

Una de las preguntas más comunes entre los desarrolladores web que comienzan a usar JavaScript… Leer más

2 semanas hace

Preimpresión digital ¿Por qué es tan importante?

Descubre qué es y para qué sirve la preimpresión digital para conseguir una buena impresión… Leer más

2 semanas hace

Tipos de consentimientos para YouTube, Twitter, LinkedIn y TikTok

Ampliamos información para las redes sociales. Descubre cómo gestionar correctamente los consentimientos necesarios en las… Leer más

3 semanas hace

Diseñadores ilustres: Michael Bierut

Michael Bierut es mucho más que un diseñador; es un educador ejemplar, un escritor locuaz… Leer más

3 semanas hace