JavaScript ES6 Features

History:

ECMAScript 6 or ES6

Released in June 2015, Harmony- biggest change, Traceur- tool compiler

Below are the few features of JavaScript:

Variables and parameters:

let x;

Earlier with Var , Scope is defined at two levels global and function, there is no block scope.

Variable are automatic hoisted on top of the function.

Let key word give true scoping on block level like inside if block in other language C.

change the error from undefined to reference Error if variable is not defined.

Const:

Initialize a read only variable.

If try to assign a value to const will give a syntax error.

Destructing:

ex:

[x,y]=[y,x];  //swapped

[y,x] is an array..We are  destructing x, y into array.

Destructed to function.

Let[x,y]=dowork();

Default Parameter values:

If caller didn’t pass the value.

name= name || “Anshu”;

ES6 : function(name=”Anshu”){…}– only if not passing() not in case if we pass undefined empty or null. || will work for all cases.

Rest parameters:

Unknown or any no. of parameter.. Add(1,2…)

 arguments.length used before.

ES6

numbers (last parameter with … prefix)

 numbers.foreach(unction(n){}

Spread operator:

Template Literals:

Change “” to back tick“

`${x} `

Classes:

Included class keyword ; Blueprint– to create object ; Hold methods

Class Vs Prototype:

In prototype we have constructor function and inside that we can add another functions.

Class behind do the same thing what prototype do

To do add Code example

Constructor– class function , this to manipulate.

 this.name=name;

 this._name

Can have parameters.

Encapsulation– to protect data using getter and setter. Wrapper around the property. Defined in ES5

Maximum call size exceeded error.

Inheritance– Is a relationship. extends keyword.

Worst way of reusing code hard coupling.

Super– Pass parameter to super class constructor from lower class by using super keyword.

Super()– invoke similar method in super class.

Override–

super.domethod() + “”;

Instanceof keyword– check in prototype.

Functional Programming:

Arrow Function— like lambda function in c#

 let add= (x,y) => x + y;

  let square = x => x*x;

 let  three = () => 3;

Array forEachmethod loop through the array element.

 numbers.forEach(n => sum +=n);

Async callback: managing the this pointer.

this value depend on the invocation.

If a this is inside the callback execution it will point to global scope. Check code ex.

 to counter this add a variable.

 let me = this;

=> Arrow function always catch the this of context. Do not worry about the this reference changes.

Iterables and iterators:

Iterator is always with next();

No length property.

are abstraction– are lazy.

Numbers.values()– dos not return array they return iterator.

.next()– method.

.done– property to say reach next.

Whie(!next.done){}

For of:

For in ( I in numbers)– loop through index. Does not work with iterator.

Values() –same– [Symbol.iterator]();

 for of look for Symbol.iterator().

 To make a class object iterable or to use for of need to add/implement  [Symbol.iterator]() method inside the class.

Generators:

Function that generates an iterator .. Require yield keyword and function*.

 let numbers = function*(){

  yield 1, yield 2 };

Comprehensions:

For building arrays and generators.

 var numbers = [ for (n of [1,2,3]) n*n];

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s