ES 2016 and Beyond

These are the notes I prepared for my KeralaJS September 2017 meet talk.

Variables

  • Block scope
    You can use let to define block scope variables
  • Constants
    Constant variables can be defined with const. Assigning another value to the variables will throw error.

String

  • Template literal
    `string${variable}` is the new way to assign strings. variable can be used inside it, rather than using addition operations of string concatenation.
  • Multi line strings
  • Tag templates
  • String.padStart, String.padEnd

Functions

  • Map and reduce
  • Arrow functions
        function square(num) {
          return num * num;
        }
        square(2);
    
    can be shortened with arrow functions like this
        var square = (num) => num * num;
        square(2);
    
  • Scope inside arrow functions
    Arrow functions get the scope of parent. So you no longer have to use bind.
  • Default values
    Like other languages, functions can now have default value for the parameters.
        function (fname, lname='') {
            return fname + ' ' + lname;
        }
    
  • Spread operator
    Spread operator can be used to expand object or array data.
        let obj = { foo: 'one', bar: 'two' }
        print(...obj);
    
  • Rest parameters
    functions can use spread operator to handle remaining parameers.

Objects

  • Property shorthand
    You no longer have to specify key if key you want is the same as the variable name.
        let a = 'one';
        let b = 'two';
        let obj = { a, b };
    
  • Computed property names
  • Method properties
  • Destructuring Assignments
  • Object.values, Object.entries

Class

  • Definition
  • Inheritance
  • Parent class access

Symbols

  • Add
  • Size
  • Delete

Set

  • Add
  • Size

Promises

  • Resolve
  • Reject

Decorators

Async-Await

  getUsers () {
      fetch('/users.html')
        .then(function(user) {
          return response.text()
        })
  };
  
  async getUsers () {
      let response = await fetch('/users.html');
      data = response.text();
      return data;
  }