JavaScript (and some other loosely typed languages) is popular for having only one data type; i.e. var. We declare everything with var in JavaScript; even the functions. So, why there is a need to redefine few things about variable declarations? What are the new features ECMA Script 6 want to provide us in variable declarations? This post contains the answer of these questions.

We all know about var; and to make ES6 backward compatible TC39 (the technical committee to decide ECMA Script roadmaps) decides to make no changes on var. Thus var remains as it is and we are skipping the description of var.

Introduction to let

let is the newly added keyword in ECMA Script 6; will be implemented in JavaScript 1.7 which has already been started getting updated in some of the browsers.

Block Scoped

This is probably the main reason why we have let today. var is not blocked scoped. But as per the requirement of the programming community, variables should have been blocked scoped. People are more habituated to blocked scoped than function scoped. let is completely block scoped.

Temporal dead zone : No hoisting

Temporal dead zone of a variable is that part of the program where that particular variable is not accessable in the scope. In case of var we had hoisting; for what var never had a temporal dead zone. But let is not similar to that.

In case of let, the variable is completely unaccessible till the time the control reaches the line of declaration.

No multiple declaration

In case of var it doesn’t matter how many time you try to declare it in a single scope (as hoisting makes things right). But in case of let, you can’t.

If the function has a parameter named “myParam”, you cant declare myParam again inside the function with let.

In loops it gets fresh binding

After the last point if you start thinking if you can declare a variable with let in a loop; than don’t worry, you can. In loops let gets a fresh binding in each iteration; thus you are free to go.
But remember unlike var, the let variable can not be accessed from outside the loop

Global variables

Again unlike var, if you declare a variable with let in the global scope, it will not become the part of the global object (window in browsers, global in Node.js).

Introduction to const

Just as let, const is also block scoped, has temporal dead zone and no multiple declaration allowed, similar behavior in global scope. However, it can not be used in loops as let can be used (shown in the last point of let).

Read only

const creates immutable variables. You can assign the value only once.

No blank declaration

Unlike let, you can’t declare a const without assigning a value. It is mandatory to initialize it while declaring.

Only the identifier itself is read only

Though it seems if an object is defined with const, none of it’s property should be editable; but in practical only the identifier itself is read only. You can edit the properties of the object.

How to make the whole object immutable

var vs let

var let
Scope Function scoped Block scoped
Multiple declaration in the same scope No issues Throws error
Temporal dead zone No Yes
Access outside loop Yes No
Declaration conflict with function params No Yes
Global scope Exists in global scope as well as become a property of the global object. Exists in global scope but doesn’t become a property of the global object.


More on variable declarations

Beyond just newly added keywords there are few more things you would like to know about ES6 variable declarations which will make you happy.

Object destructuring

Array destructuring

Object literals: property value shorthand

Change in object declaration style

If you notice, this is not a valid JSON object; but this is the new object declaration style.

Computed property key

Till ES5 you were able to compute the value of a property; but ES6 gives you the power to make a computed key. Below is an example.