harmony: 1. Constantes y locales

Primera entrada de una serie dedicada a la versión 6 de javaScript

Christian Schloe

archivado en: JavaScript / 27 octubre, 2015 / taller:

weareComienzo con esta entrada una serie de post dedicados a la nueva versión de javaScript, la número 6, denominada harmony, que en el momento de escribir estas líneas, otoño de 2015, está empezando a venir al mundo.

Más o menos, calculo que para mediados de 2016 los navegadores normales ya serán capaces de interpretar las novedades principales, aunque habrá que esperar hacia el año 3120 para que funcione también en la tostadora el explorer, que todavía da problemas con la versión actual, ecma 5, que salió a la luz en el 2011 (y sí, cada vez que alguien usa el explorer, Dios mata un gatito). Puede parecer un ejercicio de masoquismo ver todas las cosas chulas que se pueden hacer con ecma6 a sabiendas de que no podremos usarlas en proyectos profesionales, de esos en los que el cliente nos pide que funcionen incluso en el explorer, hasta vete a saber cuándo, pero vale la pena ir conociéndolas por varias razones:

a) Hay escenarios donde el explorer carece de importancia, como es el mundo node, las apis compiladas con cordova o las apis de node web-kit.

b) Existen polifylls, apaños, en caso de que algo no esté soportado, e incluso se puede utilizar algún compilador que convierte el código ecma 6 en su versión 5 si realmente nos interesa mucho utilizar alguna utilidad.

c) En proyectos personales, te puedes permitir el lujo de olvidarte del explorer.

d) Y lo último y más importante: un programador front no puede condicionar su aprendizaje al ritmo de la tostadora. Necesariamente, su formación debe ir siempre por delante.

Bueno, pues esperando haber convencido a los más recalcitrantes, vamos al lío sin más preámbulos. Pero antes os recomiendo descargaros el chrome canary si aún no lo tenéis instalado para ir haciendo las pruebas que queráis, o el Firefox Nightly si preferís este navegador, aunque también se pueden hacer test on-line en algunos sitios, como www.es6fiddle.net.

Constantes

Sí, como suena, por fin tenemos constantes en javaScript, es decir, variables que solo pueden ser definidas una sola vez en todo el ciclo de la aplicación. Se declaran con la palabra reservada const y, al menos a mí, me gusta escribirlas en mayúsculas, aunque no es necesario.

const FOO = 'Haga Basin';

console.log("FOO vale "+FOO); // FOO vale Haga Basin

/* Aunque intentemos esto, FOO sigue valiendo "Haga Basin" */

FOO = "Awesome!";

console.log("FOO vale "+FOO); // FOO vale Haga Basin

Eso no es todo: además de mantener su valor, las constantes también conservan su nombre, es decir, no puede usarse ni una variable ni una función en el mismo scope con el mismo nombre que le hemos dado a una constante.

const FOO = 'Haga Basin';

/* Esto casca : ) */

var FOO = "bar"; // Line 2: const 'FOO' has already been declared.

Variables locales

El trabajo con variables en javaScript hasta ahora no era muy elegante. El primer problema es que, salvo que se indique ex profeso el 'strict mode', ni siquiera hace falta declararlas, lo que contribuye a codificar de forma enrevesada si el programador no está atento.

El segundo problema es el denominado hoisting, que es un mecanismo por el que javaScript «sube» una variable no declarada con var al principio del par de llaves más cercanos. Para entendernos:

function foo() {

/* por el hoisting es como si js hubiera subido aquí la sentencia var foo */

foo = "Haga Basin!";

console.log(foo); // Haga Basin

var foo = "Awesome!";

}

Y esto puede provocar algún que otro lío si no estamos atentos.

Pero todavía hay, al menos, otra cosa que no mola mucho y es lo poco intuitivo que resulta el manejo de variables locales / globales. En esencia: una variable vive y muere en el ámbito de su scope, que para entendernos, es el par de llaves en el que está enmarcada al momento de declararse por primera vez. En código queda más claro:

"use strict";

var bar = "Haga Basin!";

function scopeFoo() {

/* Dentro de esta función puedo acceder a foo y a bar */

var foo = "Awesome!";

console.log(foo); // "Awesome!";

console.log(bar); // "Haga Basin!"

}

/* Desde fuera, solo a bar */

console.log(bar); // "Haga Basin!"

console.log(foo); // Uncaught ReferenceError: foo is not defined

scopeFoo();

Ahora imaginemos que tenemos 2 días para arreglar un estropicio de código de 3000 líneas de js y no sé cuántas líneas de html y js y tenemos que ir deduciendo en cada función si es una variable global o una local no declarada... una de las tantas situaciones problemáticas que provoca este lío. Lo cierto es que no parece es muy apetecible y si además ese código lo ha escrito un javero que está aprendiendo javaScript, eso se convierte en la antesala del infierno.

Bueno, pues todo esto se soluciona con tres letras: let, un nuevo tipo de variable de javaScript para designar precisamente a las variables locales, las que nacen y mueren en el ámbito de su scope, del par de llaves.

"use strict";

let foo = "Haga Basin!";

function scopeFoo() {

let foo = 99;

for (var i=0; i<10; i++) {

let foo = i;

}

console.log(foo); // 99;

}

scopeFoo();

console.log(foo); // "Haga Basin!";

Chulo, ¿no? Pues esto es solo un aperitivo de las novedades formidables que trae harmony, que ya iremos viendo en próximas entradas. Por hoy lo dejo aquí.

|| Tags: , ,

valoración de los lectores sobre harmony: 1. Constantes y locales

  • estrellica valoración positiva
  • estrellica valoración positiva
  • estrellica valoración positiva
  • estrellica valoración positiva
  • estrellica valoración positiva
  • 5 sobre 5 (1 votos)

¿Te ha parecido útil o interesante esta entrada?
dormido, valoración 1 nadapensativo, valoración 2 un poco sonrisa, valoración 3 a medias guiño, valoración 4 bastante aplauso, valoración 5 mucho

Tú opinión es muy importante, gracias por compartirla!

Aportar un comentario


*