Seleccionar página

Brendan-Eich

Cuando en mayo de 1995 Brendan Eich (en la foto) desarrolló JavaScript para Netscape no podía imaginar a donde llegaría su creación. Han pasado varias décadas y Javascript se ha vuelto omnipresente, pudiendo ejecutarse desde en un navegador, en otras aplicaciones, en servidores e incluso en bases de datos. Desde su origen como un sencillo lenguaje de script para dotar de pequeños efectos dinámicos al navegador ha ido evolucionando hasta convertirse en un lenguaje con grandes posibilidades en el que se pueden desarrollar complejos y completos sistemas.

Aunque muchos programadores han dedicado bastante tiempo a conocer y mantenerse al día de librerías, frameworks y otros elementos, la verdad es la mayoría sigue trabajando con el Javascript más primitivo, básicamente con el que fué publicado en 1999. Los cambios de las siguientes versiones de Javascript no han sido radicales y seguimos usando el lenguaje como en los 90. Ahora, con la aparición de ES6, la situación cambia de forma significativa.

Un poco de historia

Javascript ha evolucionado y ha incorporado poco a poco nuevas y útiles características, que desgraciadamente muchos desconocen. Algunas de estas características y funcionalidades las han lanzado fabricantes concretos en sus diferentes versiones de Javascript o JScript, pero es en el estándar ECMA-262 en el que debemos fijarnos.

El estándar ECMA-262 tiene cuatro ediciones realmente relevantes:

  • ECMA-262 Edición 1 (junio de 1997), que es la primera versión del estándar y que utilizaban Internet Explorer 4 y Netscape 4.06. Esta versión puso un cierto orden ofreciendo un estándar al que referirse independientemente de los fabricantes.
  • ECMA-262 Edición 3 (diciembre de 1999), que es la versión que utilizaba Netscape 6, Internet Explorer de la versión 5.5 a la 8 o Chrome de la versión 1 a la 10. La mayoría de los programadores están utilizando esta versión.
  • ECMA-262 Edición 5 (julio 2010), con su corrección la Edición 5.1 (junio 2011), es la versión de este estándar que implementan la mayoría de los navegadores modernos: Firefox 4, Internet Explorer 9, Chrome 11 o Node desde la versión 0.5.1. Es una versión que ha incorporado funcionalidades muy interesantes, pero incluso estas funcionalidades son desconocidas para muchos programadores.
  • ECMA-262 Edición 6 o ECMAScript 2015 (junio 2015), es la última versión publicada del estándar y supone un cambio muy importante en las capacidades disponibles.

Ya se está trabajando en la siguiente versión.

Casos que nos podemos encontrar

Lo que nunca llego a ser parte del estándar, pero todos implementan

Aunque pueda parecer increíble, todavía podemos encontrarnos con implementaciones de Javascript que incluyen funciones propias de Netscape 2.0 como son las que permitían añadir algunos tag HTML a una cadena de texto y que nunca llegaron a formar parte del estándar y, aunque parezca mentira, la mayoría de las implementaciones de Javascript siguen soportando.

var texto = new String("Alerta, no usar");
console.log(texto.blink());        
// Añade   antes y después del texto

Es muy mala idea utilizar este tipo de funcionalidad y afortunadamente se encuentran pocos casos donde los programadores hagan uso de semejantes características, aunque lamentablemente hay muchas referencias en Internet que incluyen este tipo de elementos sin ningún tipo de aviso y que pueden llegar a confundir a los principiantes.

Lo que añadieron unos fabricantes y otros no implementaron

Algunos fabricantes han publicado características que definitivamente no han sido parte del estándar, pero que son implementadas por varios motores, pero no por todos.

Por ejemplo, bastante recientemente la Mozilla Foundation ha incluido los métodos trimLeft() y trimRight() en la versión 1.8.1 Javascript para los objetos de tipo String, pero sólo el método trim() es parte del estándar ECMA-262 Edición 5 y superiores. Los métodos trimLeft() y trimRight() se pueden encontrar en Firefox o Chrome, pero no en Internet Explorer, ya que no son parte del estándar.

Podemos consultar esta referencia de kangax – compatibility table – non standard, que da una buena lista de funcionalidades no estándar y como es soportado por los diferentes fabricantes.

Lo que era parte del estándar y ha quedado obsoleto

Los estándares no están exentos de cambios y hay una serie de características que deberíamos dejar de utilizar, ya que en versiones futuras dejarán de estar soportadas o, como veremos en el siguiente ejemplo, son fuente de algunos problemas y confusiones.

Un caso bastante llamativo es el método getYear() de los objetos de tipo Date. Este método dejó de ser utilizable por efecto del año 2000, ya que devuelve el número de años de la fecha desde 1900, es decir, para 2015 devuelve el número 115, que no tiene ninguna utilidad.

Como este caso nos entramos con el método toGMTString() de los objetos de tipo Date, los literales con notación octal, los métodos escape() y unescape() del objeto global, etc.

Las funcionalidades de ECMA-262 5.1 que no estamos utilizando

Hay funcionalidades que se han incorporado al estándar ECMA-262 versión 5, como JSON que muchos programadores están usando desde hace ya tiempo, bien por qué han utilizado librerías que lo implementaban o bien porqué los diferentes motores de Javascript se han ido adelantando al estándar con sus implementaciones de esta funcionalidad.

Por el contrario hay bastantes funcionalidades de ECMA-262 Edición 5 que apenas son utilizadas por los programadores Javascript, e incluso nos atreveríamos a decir que apenas se conocen. Son pocos los programadores que están aprovechando las enormes posibilidades que tenemos ahora para manejar y definir objetos y sus propiedades con métodos como Object.defineProperty(), Object.freeze(), Object.preventExtensions() y Object.seal() o para crear objetos con Object.create(). Podemos definir con precisión las características de nuestros objetos.

El reto de utilizar ES6

Partiendo de esta situación llega ECMAScript 2015, los fabricantes empiezan a dar soporte a sus especificaciones y se están popularizando programas traductores de ES6 a ES5 que permiten utilizar muchas de las nuevas capacidades convirtiéndolas a Javascript interpretable por la mayoría de los navegadores y entornos.

Es posible que se terminen diferenciando dos tipos de programadores Javascript, los programadores clásicos que seguirán utilizando las funcionalidades básicas definidas en las versiones más antiguas del lenguajes y los programadores modernos, que se adentran en las nuevas capacidades de ES6, que abren ante nosotros una gran cantidad de posibilidades que ponen a nuestro alcance para hacer mejores, más completos y mantenibles desarrollos.

Cada uno de nosotros debemos decidir si adentrarnos en estas nuevas capacidades o seguir programando con Javascript como hacíamos en los 90. Está en nuestras manos.

Novedades

Template a fondo

Hay dos formas estándar de crear contenido en un componente de forma flexible: la etiqueta template, que se considera como uno de los pilares de los Web Components y las template string de Javascript, que son una buena alternativa para generar el Shadow DOM con interpolación de datos.

Light DOM a fondo

El Light DOM es un espacio compartido entre nuestro componente web y el DOM general, que podemos utilizar para insertar contenido o configurar nuestro componente. Es una muy interesante característica que debemos conocer.

Shadow DOM a fondo

Para que los componentes web no colisionen unos con otros es muy útil utilizar el Shadow DOM para aislar el DOM y el CSS de cada componente. Esta característica se puede aplicar también a elementos HTML sin necesidad de utilizar Custom Elements, pero es con estos donde cobra todo su potencial. Demos un repaso profundo a las capacidades del Shadow DOM.

HTMLElement a fondo

HTMLElement es una pieza clave, ya que de él heredan todos los componentes web, pero en muchas ocasiones no conocemos bien sus características. Os invitamos a dar un repaso a fondo a sus capacidades y descubrir cómo sacarle todo el partido en nuestros componentes.