Desarrollo de Aplicaciones

ECMAScript 6 y sus tres tipos de variables disponibles

En el nuevo estándar de Javascript (ES6) tenemos disponibles tres tipos de variables. Aquí te explicamos cual son sus diferencias y por qué debes empezar a utilizarlas.

drauta
Mario Garcia
Mario Garcia

Enero 08, 2021

ECMAScript 6 y sus tres tipos de variables disponibles.

Desde Junio del año 2015 tenemos ante nosotros el nuevo estándar de Javascript llamado ECMAScript 6 o ES2015, y desde entonces tenemos disponibles nuevas funciones que podemos utilizar desde ya mismo en nuestro proyectos y nos van a facilitar la forma en la que tratamos los datos, implementamos algoritmos, promesas, funciones flechas, Class, find(), etc. Todas ellas nos van a permitir poder implementar soluciones de forma menos compleja y con la posibilidad de poder hacer un código más entendible y escalable.

En este articulo, nos vamos a centrar en explicar las características de las nuevas variables disponibles, sus diferencias, cuando y donde usarlas:

  • Var
  • Const
  • Let

Vamos a tratar cada una de las variables disponibles, con una breve explicación y con ejemplos de uso, para que su funcionamiento se comprenda de mejor forma:

Var:

Var es la variable típica y que todos los que programamos con Javascript estamos habituados a utilizar.

Según donde se vaya a declarar, su scope será de carácter global o local:

  • La variable Var declarada fuera de contexto de función, tendrá un scope global.
  • La variable Var declarada dentro de contexto de función, condicional o bucle, tendrá un scope de carácter local.

* Scope: Cuando se habla de la diferencia entre tipos de variables aparecerá la palabra “scope”, qué es? El scope es el alcance que una variable tendrá en tu código. El scope te permitirá acceder a la información de una variable u otra dependiendo en qué lugar del código se ha declarado (Var) o qué tipo de variable sea (Let, Const). Existen dos tipos de scope, el scope global y el scope local.

Pongamos un ejemplo de Var con código:

var

Si nos fijamos, estamos viendo que efectivamente el scope de Var dependiendo de en qué lugar se esté declarando, el resultado (output) es uno u otro.

Faltaría por ver qué ocurre cuando redeclaramos una variable Var dentro de contexto de función o bucle y cuando por lo contrario, “llamamos” a esta misma variable dentro del mismo ámbito, sin declararla:

var2

Dentro de la función, y en el mismo bucle, en un primer momento, el valor de la variable será el mismo que el valor de la variable global (fuera de la función) declarada con el mismo nombre, pero a medida que se ejecutan las iteraciones, su valor modificará. Pues el valor entonces, en el output fuera de la función será el resultado de la iteración.

En cambio:

var3

Si volvemos declar la variable dentro del bucle, el valor resultante no se verá modificado y será el mismo que el de la variable global (fuera de la función).

Como vemos, el lugar donde declaramos y reasignamos el valor de una variable es muy importante cuando se usa la variable Var. Esto se soluciona con el uso de las nuevas variables Let y Const.

Let

Let es una variables con scope local, que a diferencia de Var, su output no dependerá de en qué lugar del código se esté declarando:

let1

Cabe decir también que no podemos declarar dos veces una misma variable Let con el mismo nombre (a diferencia de Var), entonces aparecerá un error por consola que impedirá el correcto flujo de ejecución del Javascript. Esto provocará que el código sea más limpio y entendible.

Const

Const es una variable de scope global. Ya no vamos a tener que preocuparnos de declarar la variable Var fuera del contexto de función, loop o condicional para que la misma sea global.

const

La variable Const a diferencia de las dos anteriores, no nos va a permitir asignar un nuevo valor para la misma en el caso de que esta ya esté declarada previamente.

Comparte este artículo

Artículos Relacionados