ES5 to ES6

Oooh! Is this progression of the web I see with ES7?

As we prepare to leave 2016 behind, many others like me are looking forward to the adoption of ECMAScript7 and even ECMAScript8 which are to come accompanying 2017 and 2018. With the many new features we have already started seeing in ES6, which allows for faster development, I have high hopes for the newer versions to come.

So far, ES6 offers us code-sugars such as Classes, Modules, Let construct, Arrow functions, Promises, template literals, multi-line strings and even constant initialisation. All of which can make a developer’s life easier. Of course, ES6 is still quite new to the playing field after being released last year (2015), but I remain hopeful; especially after seeing the countless transpilers out there that offer users the ability to transpile ES6 code to ES5 standards.

In my opinion, switching to ES6 is definitely worthwhile. And although many of you out there may think otherwise, these pieces of “syntactic sugar” can really speed up your development, giving you more time to think about your project logically, than having to focus on boilerplate code. Furthermore, every extra line you don’t have to type will make your code more readable. For example, the code below is how we would create a class with methods and properties in ES5:

var Zoo = (function () {
    function Zoo() {
        this.animals = [];
    }
    // Methods
    Zoo.prototype.addAnimal = function (name) {
        console.log("I'm a " + name);
        this.animals.push(name);
    };
    return Zoo;
})();
// create and call
var myZoo = new Zoo();
myZoo.addAnimal("Lion");

Whereas the code below illustrates how you would do the same thing in ES6:

class Zoo {
    constructor() {
        this.animals = [];
    }
    addAnimal(name) {
        console.log("I'm a " + name);
        this.animals.push(name);
    }
}
// create and call
var myZoo = new Zoo();
myZoo.addAnimal("Lion");

Up until now, I have only managed to make use of Classes, the Let construct, and the string template literals, but as the adoption of ES6 and ES7 grows a little more, I will definitely seek to embed more of the new syntaxes that ES6 and ES7 have to offer.

Comments