Javascript is the lingua franca for the front end of web development. In modern JS world (ES6 onwards), there had introduced let and const for variable declaration. A lot of newbies to ES6 will be confused on what are the difference of them with var?

In this tutorial, I am going to explain which case of scenario to use which type of declaration.

Javascript Primitive Value

Primitive Value is a data type aren't object and has no method. Primitive Value are immutable by default, unless you use a wrapper. (e.g. var a = new String('hello'))

Currently, there are 6 types of primitive value is JS:-

• null
• undefined
• boolean
• number
• string
• symbol (ES6)

Everything else extends from Object (where object we deal with a lot of mutable object)

Observe the difference between object and primitive value

Object	Primitive Value
Object can be mutated	Primitive Value are immutable
var obj = new String("hello")	var prim = "hello"
Seldom being directly use	Preferred way of declaration

Variables Declaration & Scope

In modern JavaScript (EcmaScript6) it introduce 2 new variable declaration which is let and const, there is 3 types of variables declaration and scope:-

• var
• let
• const

var	let	const
declarations are hoisted	declaration are not hoisted	declaration are not hoisted
not block-scope	block-scope	block-scope
Reassignment is allowed	Reassignment is allowed	Reassignment is not allowed
-	-	must be initialize

hoisted means that the variable can be used before it declare.

Hoisted Example

x = 5;
console.log(x);
var x;

This code will work because var is able to be hoiste. But this does not work with let or const because both methods does not support hoiste.

Block Scope

var

var x = 3;
if (x===3) {
  var y = 5;
}
console.log(x+y); // 8

This code will return value of 8 because var is function scope instead of block scope.

let or const

let x = 3;
if (x===3) {
  let y = 5;
}
console.log(x+y); // ReferenceError: y is not defined

You will get a reference error.

Use Case

• Use const whenever it is possible.
• const means that the value does not change.
• In 90% of the time, we should be using let and const. Unless, we are dealing with hoisted situation. (example shown below)

Using let

x = 5;
console.log(x);
let x;

Result:

Using var

x = 5;
console.log(x);
var x;

Result:

This is because let is not hoisted. Therefore, for this certain scenario, var is the one that we should be using.

Source

Angus Croll, The Secret Life of JavaScript Primitives, September 27, 2010

About Me

I am Lai Weng Han (Johnson), you can find me on Twitter.

---

Posted on Utopian.io - Rewarding Open Source Contributors

---