ECMA6 Script: Mejorando el JavaScript

Mejorando-javascriptJavaScript, si eres desarrollador Web o has participado en algún proyecto, siempre está presente tanto como solución, como pesadilla. Pesadilla por su sintaxis y por la dificultad de escribir un código legible, mantenible y en algunos casos, orientado a objetos. Para poder trabajar de una forma agradable se utilizan frameworks como JQuery o herramientas como TypeScript o CoffeScript para escribir código JavaScript de forma amigable y cumplir con los objetivos anteriormente mencionados.

Pero, ¿cómo surgió ECMAScript? ECMAScript surgió por la necesidad de crear un estándar que pudieran implementar todos los navegadores a la hora de poder interpretar los códigos script que había en el momento como JavaScript, JScript o ActionScript.

La actual versión de JavaScript usada en los navegadores está basada en ECMAScript 5, y actualmente el equipo de ES ya trabaja en la nueva versión ECMAScript 6, que ya está casi definido y que muy pronto los navegadores empezarán a implementar. Los objetivos de ES6 son la creación de:

  • Aplicaciones complejas
  • Librerías
  • Generación de código

ES6 vendrá con muchas novedades que facilitarán la implementación de JavaScript algunas de estas novedades son:

1. Variables:

  • Let: Actualmente se pueden crear variables con “var”, pero estas solo se pueden crear a nivel global de función, no a nivel de un scope local. Define una variable en un scope local:

variables-let

  • Const: Permite definir una constante. Se aplican dos restricciones sobre la variable:
    • No permite modificaciones sobre la variable.
    • Bloquea la variable.

Es decir, es como una variable “let” a la cual no se le puede cambiar el valor.

variables-const2. Destructuring:

Se entiende como Destructuring la técnica que permite asignar valores a un conjunto de variables a partir de un objeto o matriz de objetos sin navegar en cada entrada de estos.

  • Array destructuring: podemos inicializar variables a la vez o intercambiarlas sin necesidad de crear variables temporales.

array-destructuring

3. Spread:

Esta técnica permite expandir variables de un array en n parámetros.

spread

4. Iterators:

Los iteradores nos permiten recorrer arrays o colecciones de forma sencilla y rápida.

  • Built-in Iterators: Iterators son objetos que implementan el método next() que devuelve un objeto con dos propiedades:
    • Value: valor de selección.
    • Done: Indica que se ha llegado al último elemento.iterators-ecmascript
  • For..of: bucle para iterar sobre iterables. Permite iterar sin utilizar el método next() y comprobar la propiedad done.

for-of-ecmascript

  • Defining custom iterators: también se pueden definir iteradores sobre objetos de una clase o array. Para ello hay que implementar la inteface IEnumerable.

custom-iterators-ecmascript

  • Generators: permite escribir iteradores de forma rápida y sencilla, consiste en:
    • La función generadora comienza con un *
    • Usar la palabra yeld para devolver valores.

generators-ecmascript

5. Clases:

Una de las grandes novedades de ES6 es la creación de clases en JavaScript que nos permite implementar orientación a objetos, permite crear constructores, métodos y propiedades:

clases-ecmascript

  • Inheritance: otra gran aportación de ES6 es la herencia. La herencia es una de las grandes características de la OO y ES6 nos permitirá hacerlo.

inheritance-ecmascript

6.Functions

  • The arrow function: para los programadores .Net esta nueva propiedad nos es muy conocida y sabemos de su gran utilidad, con las arrow function nos permite realizar lambda expressions.

arrow-function-ecmascript 

  • Default parameters: permite inicializar valores por defecto si no se pasa ningún valor al llamar la función.

default-parameters-ecmascript

  •  Rest Parameters: nos permite pasar una matriz de elementos como parámetros a una función:

rest-parameters-ecmascript

Conclusiones:

ES6 contiene un gran número de mejoras que nos permitirán escribir código JavaScript de una forma más natural para los desarrolladores acostumbrados a la orientación de objetos. Esto permitirá escribir mejor código JavaScritpt, realizar un código más limpio y simple, lo que permitirá realizar código de mayor calidad, más testeable y más mantenible.

En el siguiente link se puede ver la compatibilidad con ES6:

https://kangax.github.io/compat-table/es6

Referencias:

http://code.tutsplus.com/articles/use-ecmascript-6-today–net-31582

http://en.wikipedia.org/wiki/ECMAScript

http://www.dotnetcurry.com/showarticle.aspx?ID=1090

Más información:

Roberto Bermejo

.NET Architect and Cloud Lead | Soluciones Microsoft | SOGETI ESPAÑA

Sogeti puede ayudarle con esta y otras soluciones bajo tecnología Microsoft. Si quiere saber cómo, visite nuestra web.

Responder

Introduce tus datos o haz clic en un icono para iniciar sesión:

Logo de WordPress.com

Estás comentando usando tu cuenta de WordPress.com. Cerrar sesión / Cambiar )

Imagen de Twitter

Estás comentando usando tu cuenta de Twitter. Cerrar sesión / Cambiar )

Foto de Facebook

Estás comentando usando tu cuenta de Facebook. Cerrar sesión / Cambiar )

Google+ photo

Estás comentando usando tu cuenta de Google+. Cerrar sesión / Cambiar )

Conectando a %s