Mastering JavaScript

We will cover the most important part of ES6 specifications in this chapter. You
should explore all the features of ES6 if possible and make them part of your
development workflow.
Chapter 7
ES6 syntax changes
ES6 brings in significant syntactic changes to JavaScript. These changes need careful
study and some getting used to. In this section, we will study some of the most
important syntax changes and see how you can use Babel to start using these newer
constructs in your code right away.
Block scoping
We discussed earlier that the variables in JavaScript are function-scoped. Variables
created in a nested scope are available to the entire function. Several programming
languages provide you with a default block scope where any variable declared
within a block of code (usually delimited by {}) is scoped (available) only within this
block. To achieve a similar block scope in JavaScript, a prevalent method is to use
immediately-invoked function expressions (IIFE). Consider the following example:
var a = 1;
(function blockscope(){
var a = 2;
console.log(a); // 2
})();
console.log(a); // 1
Using the IIFE, we are creating a block scope for the a variable. When a variable is
declared in the IIFE, its scope is restricted within the function. This is the traditional
way of simulating the block scope. ES6 supports block scoping without using IIFEs.
In ES6, you can enclose any statement(s) in a block defined by {}. Instead of using
var, you can declare a variable using let to define the block scope. The preceding
example can be rewritten using ES6 block scopes as follows:
"use strict";
var a = 1;
{
let a = 2;
console.log( a ); // 2
}
console.log( a ); // 1
[ 165 ]
www.it-ebooks.info