En el último día en que hablamos sobre algunos de los conceptos fundamentales de JavaScript vimos cómo funciona la pila de llamadas y debatimos que conocer esta funcionalidad nos permite entender qué pasos sigue JavaScript para ejecutar nuestro código.

También vimos que declarar una variable en el inicio o final de nuestro código importa. Esto significa que ya sabes qué necesitas hacer para declarar funciones/variables con alcance global, y qué debes hacer para que estas variables se puedan ejecutar en cualquier parte de tu código.

Hoy quiero comentar contigo sobre otros de los conceptos fundamentales del lenguaje de programación de la moda: el alcance local y el de bloques.

Pero antes de seguir, te dejo algunas definiciones:

¿Qué es un alcance?

Un alcance, o scope en inglés, determina la visibilidad de una variable, o sea, hasta donde puedes acceder a una variable dentro de tu código.

¿Qué es un alcance local?

En Javascript existen varios tipos de alcances, como ya hemos dicho varias veces, pero para el “alcance” de este artículo nos centramos en el alcance local y en el de bloques. Por tanto, un alcance local existe cuando las variables necesarias son declaradas dentro de una función de JavaScript. Esto significa, muy brevemente, que las variables locales tienen “alcance de función” y solamente se puede acceder dentro de la función. El alcance local puede ser dividido en alcance de función y alcance de bloque.

Ejemplo

Cómo puedes ver, el código es bastante explicativo. Si declaras catName dentro de tu función getAge(), no podrás usarla fuera de la función, por eso se dice que su scope es local.

Me parece interesante también que sepas lo siguiente: porque solamente se reconocen dentro de sus funciones, en JavaScript las variables pueden tener el mismo nombre y ser usadas en funciones diferentes. Esto significa que podrías volver a declarar catName en otro sitio.

Además, si recuerdas del artículo sobre “la pila de llamadas” las variables locales se crean cuando la función empieza y JavaScript las elimina al final de la función. Por eso si intentas llamar catName fuera de la función getAge() recibirás un error de Referencia. “catName is not defined”.

Hablando en variables… ¿qué pasa con el alcance de bloque?

Si te has fijado, en el ejemplo anterior uso var para declarar la variable catName. Pero en JavaScript existen tres formas de declarar variables: var, let i const. Desde mi punto de vista, es buena idea siempre que se hable de scopes hablar también  de estas “declaraciones”. Las variables de Javascript son contenedores para almacenar valores de datos, pero….¿Qué diferencia hay entre ellas? ¿Las puedo usar indistintamente, por qué me gusta más una que otra? La respuesta corta es NO! Te ayudo a entender porqué en las siguientes líneas.

Var

Var es la “declaración” que más utilizas seguramente, si ya llevas años desarrollando en JavaScript.  Es interesante pues permite que la variable que declares sea actualizada y reasignada. Pero como hemos visto anteriormente, las variables var solamente están disponibles dentro de la función en que son creadas, o si son creadas fuera de la función y tengan un alcance global.  Puedes alterar su valor desde cualquier parte de tu código, respetando la pila de llamadas. Si la defines dentro de una función e intentas llamarla fuera, tendrás el error mencionado.

const y let

ECMAScript 2015 trajo dos nuevos conceptos, declaraciones, o palabras clave de JavaScript: let y const. Lo interesante de estas novedades es que permiten tener variables y constantes de alcance de bloque en JavaScript.

¿Qué es un alcance de bloque?

Un alcance de bloque es la sección dentro de las condiciones if, switch, o dentro de métodos de iteración com while.

Es en esta evolución del lenguaje, el concepto de bloque significa simplemente un conjunto de llaves de apertura y cierre “{}”. Estas palabras clave soportan la declaración de alcances locales dentro de bloque de instrucciones y tu como desarrollador puedes declarar variables que existen solamente dentro de un “bloque” específico.

Creo que para evitar perder tiempo en debugging, es importante conocer estas diferencias, pues por ejemplo en el siguiente código, la variable catYears  que está definida dentro de las llaves:

tiene scope global y su resultado fuera cuando es llamada fuera del bloque será 48 - ¿cierto?. Sin embargo si sustituyes var por let o const, el resultado será de console.log() será el mismo, pero si llamas catYears fuera del bloque:

tendrás un error de referencia por variable no definida: “Uncaught ReferenceError: catYears is not defined”.

Debes recordar también que aunque se parezcan, la declaración const crea una referencia a un valor solo de lectura. Esto significa que el identificador de la variable no puede ser reasignado!

Conclusión

Y eso es todo por hoy. Let, y const por seren formas modernas de declarar variables te pueden parecer muy atractivas. ¡Pero atención con el scope de cada una de estas formas! Recuerda que var tiene alcance de función (global o local), y let y const tienen alcance de bloque!

¿Crees que let y const son realmente útiles o prefieres utilizar siempre var?

Foto:  Alex Qian from Pexels

Fuentes:

Compartir es construir