Por fin saco algo de tiempo para asimilar las novedades que nos trajo ECMAScript 2015 (ES6), todas ellas ayudándos sobre todo a que nuestro código se vuelva más legible. Sin duda alguna es paso adelante aunque personalmente este baile de versiones, mejor dicho, de baile de nombres versiones me tiene superdespistado.

¿Qué es ECMAScript?

Es la especificación o estandarización con nombre ECMA-262 creada por ECMA (European Computer Manufacturer Association). Esta especificación es la que se implementa entre otros Javascript o ActionScript.

Un poco de historia

  • La primera versión de ECMAScript 1 salió en el año 1997 y nació ante la necesidad de estandarizar la forma de utilizar el lenguaje por parte de los navegadores. Al año siguiente, 1998, apareció la siguiente versión
  • ECMAScript 2 cambios para alinearse con los estándar internacional ISO/IEC 16262.
  • ECMAScript 3 apareció en 1999 e incoporó como novedades expresiones regulares, manejo de strings, gestión de excepciones con try/ catch, etc.
  • ECMAScript 4 fue abandonado debido a discrepancias políticas.
  • ECMAScript 5 apareció en 2009 y agregó entre otros el modo estricto, mejor comprobación de errores, agregados los getters y setters y un soporte para JSON ( JavaScript Object Notation).
  • ECMAScript 6 apareció en 2015 y es la versión sobre la que voy a comentar en este artículo pero como grandes novedades tenemos el soporte para clases y módulos. Su nombre oficial es ECMAScript 2015.

Novedades principales

  • Arrow Function. Introduce la “función de flecha” como un acceso directo para crear funciones anónimas con un ámbito limitado.
    //Antes
    users.forEach(function (user) {
        logger.log(user.name);
    });

    //Ahora
    users.forEach(user => logger.log(user.name));
  • The let keyword. Bloqueamos el ámbito o alcance de las variables.
    function iterate() {
        //index sólo es visible dentro del bucle
        for( let index = 0; index < 5; tuce++ ) {
            //tuce is only visible in here (and in the for() parentheses)
        }
    }
  • Default Values for Function Parameters. Tenemos disponibles los valores por defecto en los parámetros de las funciones.
    //Antes
    function discount (value){
        return value || 2;
    }
    discount(5);
    
    //Ahora
    function discount (value=2){
        return value;
    }
    discount(5);
  • const Declarations Tenemos disponibles variables de sólo lectura.
    //No podremos modificar su valor
    const poweredBy = 'MookieFumi';
  • Shorthand Properties/ Object Enhancements. Las propiedades abreviadas nos permiten componer objetos complejos de otros objetos así como ayudarnos a escribir menos código y poder crear objetos de manera más rápida ya que no será necesario indicar el nombre de los mismos ya que tomarán por defecto el nombre que ya tienen.
    let age = 40;
    let nickName = "MookieFumi";
    let user = {
        age,
        nickName
    };
  • Using the ES6 spread operator. Nos permite “explotar” un array en elementos individuales.
    function log(param1, param2, param3) {
        console.log(param1.id, param2.id, param3.id);
    }
    let options = [{id:1}, {id: 2}, {id: 3}];
    log(...options);
  • String Templates in ES6. Las plantillas de cadena de texto nos permiten usar cadenas de texto de más de una línea así como la interpolación.
    var nickName = "MookieFumi";
    var output = `
        My nickName is ${name}
    `;
    console.log(output);