ES6 - Overview

ECMAScript (ES) is a scripting language specification standardized by ECMAScript International.

JavaScript

JavaScript started life with the name Mocha, and was briefly named LiveScript before being officially renamed to JavaScript. It is a scripting language that is executed by the browser.

ECMAScript6 has the following new features.

Support for constants
Block Scope
Arrow Functions
Extended Parameter Handling
Modules
Classes
Iterators
Generators
Collections
New built in methods for various classes
Promises

JavaScript Variable Scope

Global Scope − A variable with global scope can be accessed from within any part of the JavaScript code.
Local Scope − A variable with a local scope can be accessed from within a function where it is declared.

ES6 defines a new variable scope - The Block scope.

1

The Let and Block Scope

function test() { 
   var num = 9;
   console.log("value of num in test() "+num);
   (function() { 
      console.log("Inner Block begins") 
      let num = 90 
      console.log("value of num : "+num)  
   })(); 
} 
test();

// Output
// value of num in test() 9
// Inner Block begins
// value of num : 90

The script declares a variable num within the local scope of a function and re-declares it within a block using the let keyword.

Example: let v/s var

var no = 10; 
var no = 20; 
console.log(no);

// Output 20

Let us re-write the same code using the let keyword.

let no = 10; 
let no = 20; 
console.log(no);

The above code will throw an error: Identifier 'no' has already been declared.

Uncaught SyntaxError: Identifier 'no' has already been declared

2

The const

The following rules hold true for a variable declared using the const keyword

Constants cannot be reassigned a value.
A constant cannot be re-declared.
A constant requires an initializer. This means constants must be initialized during its declaration.
The value assigned to a const variable is immutable (unable to change).

3

Lambda Functions / Arrow functions

There are 3 parts to a Lambda function

Parameters − A function may optionally have parameters.
lambda notation (=>) It is also called as the goes to operator.
Statements − Represents the function’s instruction set.

It is an anonymous function expression that points to a single line of code. Following is the syntax for the same.

([param1, parma2,…param n] )=>statement;

Lambda Expression

var foo = (x)=>10+x 
console.log(foo(10));

// Output 20

The function returns the sum of 10 and the argument passed.

Lambda Statement

It is an anonymous function declaration that points to a block of code. This syntax is used when the function body spans multiple lines. Following is the syntax of the same.

( [param1, parma2,…param n] )=> {       
   //code block 
}

Example

var msg = ()=> { 
   console.log("function invoked") 
} 
msg();

// Output : function invoked

Syntactic Variations

Optional parentheses for a single parameter.

var msg = x=> { 
   console.log(x) 
} 
msg(10)

Optional braces for a single statement. Empty parentheses for no parameter.

var disp = ()=>console.log("Hello World") 
disp();

4

Returning Multiple Values

ES6 provides a array like syntax to assign multiple variables to values of array indexes destructuring feature. It also lets you ignore some array indexes.

function function_name()
{
    return [1, 6, 7, 4, 8, 0]; 
}
var q, w, e, r, t, y;
//Here we are using ES6's array destructuring feature to assign the returned values to variables.
//Here we are ignoring 2 and 4 array indexes
[q, w, , r, , y] = function_name();

alert(y);//y is 0

5

Default Function Arguments

ES6 provides a new syntax that can be used to define default values to function parameters:

function myFunction(x = 1, y = 2, z = 3)
{
	console.log(x, y, z); // Output "5 6 3"
}
myFunction(5,6);

Defaults can also be expressions.

function myFunction(x = 1, y = 2, z = 3 + 6)
{
	console.log(x, y, z); // Output "5 6 9"
}
myFunction(5,6);

sureshalagarsamy/ES6-Overview