Voice of a Developer: JavaScript ECMAScript 6 Features v2 - Part Twenty

JavaScript is a language of the Web. This series of articles will talk about my observations learned during my decade of software development experience with JavaScript.

Before moving further let us look at the previous articles of the series:

In last article we learnt about ECMAScript 6 features and now we will learn some more cool features.

  1. Default values

    We can add default values to function expressions. In ES5, default value is undefined if value is not passed via argument. Example ES5.

    1. function coordinates(x, y)  
    2. {  
    3. console.log(x);  
    4. console.log(y);  
    5. }  
    6. coordinates(10); // 10 undefined  

    In ES6 we will change it to,

    1. function coordinates(x=10, y=20)  
    2. {  
    3. console.log(x);  
    4. console.log(y);  
    5. }  
    6. coordinates(10); //10 20
        
  2. Modules

    This is the feature I like the most! We need to define each module in a file then export keyword to export. On receiving side we use import keyword to import. This modular approach is really good solution for code reusability and abstraction.

    Modules are designed around the export & import keywords.

    code

  3. Classes

    This is a favorite keyword of OOPS developers but JavaScript is prototypal based and function is a first class citizen in JavaScript. Introducing classes in ES6 is debatable and many people have notion that it is not in favor of JavaScript prototypal nature.

    Leaving aside, we can understand what lies in this feature.

    Like OOPS programming languages, classes in ES6 are revolving around class & constructor. Example,
    1. class Automobile  
    2. {  
    3.     constructor(type)   
    4.     {  
    5.         this.type = 'bike';  
    6.         this.engine = '150 CC';  
    7.     }  
    8.     getEngine()   
    9.     {  
    10.         return this.engine;  
    11.     }  
    12. }  
    13. var vehicle = new Automobile('Honda');  
    14. console.log(vehicle.getEngine()); // 150 CC  

    Inheritance

    Use extends keyword for inheritance to inherit from base class. Example

    1. class LogView extends View   
    2. {  
    3.     render()   
    4.     {  
    5.         var compiled = super.render();  
    6.         console.log(compiled);  
    7.     }  
    8. }  
    9. class LogView extends View {}  

  4. Multi-line Strings

    It’s a sugar syntax to cut long,

    1. var s = 'hello '  
    2. 'world';  
    3. console.log(s);  

Summary

You can try these awesome features of ES6. Please share comments/ feedback.