ECMAScript 2015 and Hoisting Overview

Sultan Mahmud
4 min readMay 6, 2021

Today I will discuss ES6 and Hoisting

Before starting Hoisting we need to Clear the idea of some ES6 Features.

#First I am talking about var, let, and const

Before ES6 a programmer only uses var for declaration variable in javaScript. now we can use let and const also. why came let and const ??

Remember:

  1. var is a function scope, But let and const is a block scope.

2. if you declare a variable by using var you will again declare the same variable by using var.

example:

In this example programming first true and second false. I will declare the same name as a variable using the var keyword. a programmer writes many codes in the same application that the reason creating name conflict is a simple matter. That is the main problem.

But If you use let you don’t don. You have no option to mistake this. How??? Let's see the code :

In this example when I wanted to use the same name as a variable then throw me an error. There is no way to mistake.

let and const both are the same but have a simple difference. By using let you can reassign value but using const you can’t do this.

JavaScript Function Scope

In JavaScript there are two types of scope:

  • Local scope
  • Global scope

JavaScript has function scope: Each function creates a new scope.

Scope determines the accessibility (visibility) of these variables.

Variables defined inside a function are not accessible (visible) from outside the function.

Let’s see an example

JavaScript Block Scope

Block scope is an area within if, switch conditions or for and while loops. Generally speaking, whenever you see {curly brackets}, it is a block.

Let’s see an example

#Hoisting

Hoisting is JavaScript’s default behavior of moving declarations to the top.

In JavaScript, a variable can be declared after it has been used.

Let’s see an example:

Here, 1st I assign a=10 and print a; result 10 successfully done. after I declared the variable.

How is it possible?? It is possible for hosting. When the browser engine compiles this code then variable declarations go to the top position. This is Hosting the main concept.

Note: top position means every variable owns scop’s top position.

example:

for variable number2 of A position, its top position is the global scope.

same way number2 for C is a block scope that why its top position is C.

Functions with Default Parameter Values

when we write a function we can set the default Parameter.

If the user forgets to pass the parameter( without setting the default parameter) program will throw an error. To solve this problem we can set the default parameter.

example:

When the user forgets to pass the parameter then the default parameter will be assigned otherwise parameter won’t be assign

Functions with Unnamed Parameters

If you don’t set a parameter on a function but you pass the parameter when you are calling a function. Then you can receive this value inside this function by using arguments. arguments are not an array but an array-like object.

Let’s see an example:

#Spread syntax (…)

The spread operator is a useful and quick syntax for adding items to arrays, combining arrays or objects, and spreading an array out into a function’s arguments.

Let’s see an example:

#JavaScript Arrow Function

Arrow functions were introduced in ES6. Arrow functions allow us to write shorter function syntax. Arrow functions are not concern about this keyword

Let’s see an example:

--

--