ECMAScript 8 or ECMAScript 2017 was officially released last year end of June by TC39 (what is TC39? Technical Committee 39 which is the official committee for the evolution of Javascript. This committee conducts meeting regularly and usually the members are browser vendors ). Now the standard is to publish new specifications once a year. ES5 was published in 2009 and after that, the major release was ES6 in 2015, ES7 in 2016.

This article covers some of the new features of ES7 and ES8 with the simple examples:

Class Properties :

You can initialize the class properties outside of constructor!

Example:

class Animal {

    constructor() {

        this.name = "Lion"

    }

    age = 0;

}

That will be complied to:

    class Animal {

        constructor() {

            this.age = 0;
            this.name = "Lion";

        }

    }

Especially react developers can relate easily state! and initialProps!:

    class Animal {

        constructor() {

            this.name = "Lion"

        }

        age = 0;

        state = {

        }

        initialProps = {

        }

    }

 

BabelJs.IO can be used for testing all the new features of ECMA, you can configure presets and test. Here is an example run in babeljs.io Example

es7-es8

 

Yes, in the same way, you can use in Javascript now!.

padStart and padEnd:

padStart :

The padStart() method pads the current string with another string (repeated, if needed) so that the resulting string reaches the given length. The padding is applied from the start (left) of the current string.

Example:

es7-es8

padEnd :

The padEnd() method pads the current string with a given string (repeated, if needed) so that the resulting string reaches a given length. The padding is applied from the end (right) of the current string.

For example :

es7-es8

Exponential Operator:

The exponentiation operator returns the result of raising the first operand to the power second operand. Exponentiation operator is right associative. a ** b ** c is equal to a ** (b ** c).

Example:

es7-es8

Trailing comma :

Trailing comma is allowed in an array, object and function parameters.

Example:


var list = [

    "one",

    "two",

    "three",   // It is valid

]

var obj = {

    one: "1",

    two: "2",

    three: "3", //  It is valid

}

function add(

    one,

    two,

    three, // It is valid

) {

}

 

Object.values() and Object.entries():

Object.values () : You are familiar with Object.keys(). This is exactly opposite of Object.keys().

Example:

var fruits = {
  
    apple: 10,
    orange: 20,
    grapes: 30,
    pineapple: 40
  
}

var totalVegetables = Object.values(fruits).reduce((a, b) => a + b);

console.log(totalVegetables);


 

Output : 100

Object.entries():

Object.entries() method returns an array of a given object’s own enumerable property [key, value] pairs.

Example :

var fruits = {

    apple: 10,
    orange: 20,
    grapes: 30,
    pineapple: 40

}

for (var [key, val] of Object.entries(fruits)) {

    console.log(key, val);

}


 

Output:

apple 10
orange 20
grapes 30
pineapple 40

 

ES9 is on the way hope it will meet all the wishlists of the developer!

Looking for AngularJS Development Company? Hire our dedicated developers!

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes:

<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>

This site uses Akismet to reduce spam. Learn how your comment data is processed.