Look at Line number1, 2, 3 here I am trying to access the values of functions and variables even before initializing.

Hoisting is all about that only where we can access their values even before initializing and without even getting any errors. so here I have declared the variables using var, I can do that with let and const as well but it will behave differently in each case, let's discuss them one by one how will it behave.

In this Progam, I have declared it using var so what will be the output, let's see the output first of all.

So I am getting Output here

• undefined

• Person Details

The reason I am getting here is undefined because in Javascript even before the code starts executing memory is allocated to all those variables and functions. Whenever a program gets executed in Javascript The execution environment is created and it is divided into two phase

1. Memory Component

2. Code Component

So in phase one javascript will allocate memory to variables and functions and store a special value inside it called undefined and for functions, it stores the whole code inside it so even before the codes get executed javascript allocates memory to its variable and functions, Let me show you the Image for More clarity

I have put a debugger at line number two my program is not fully executed but still, a Global Execution context was created and it is been pushed into the stack.

now let's look at the variables and functions inside the global, where all the variables are stored with a special value called undefined, and inside the function, the whole function code is stored.

so all the images are from phase one (Memory Creation Phase) due to this phase all our variables are functions are allocated some memory and we can access it before even initializing value to them, and this is known as hoisting.

But with let and const it will behave a little differently, But it doesn't mean that the variables which are declared with let and const are not hoisted, they are hoisted but there is one problem with let and const and that is behind the scenes the javascript will hoist which is declared with let and const but they are not initialized and we will get an error as

"ReferenceError: Cannot access before initialization

Will show you that let and const its actually getting hoisted.

but still after getting hoisted they are not getting initialized.

the variable I have declared with var for that I am getting undefined but for let, I am getting an error.

Declarations are Hoisted But Expressions are not hoisted

Creating a function using function declaration

PersonDetails()
function PersonDetails(){
  console.log('Person Details')
}
//Output
//------
Person Details

Creating a function using function Expression

let result = persondetails()
console.log(result)


let persondetails = function(){
  console.log('Display Details')
}

//Output
ReferenceError: Cannot access 'persondetails' before initialization

1st example I created a function using function declaration and it's working well the other one I created using a function expression in which we are getting errors.

Hoisting in Arrow Function:

Arrow functions are not hoisted, Arrow function will also give us the same error we got during function Expression, I mean Both are not hoisted (arrow function and function expression)

Hey, Guys are you reading my blog if yes then please do comment whether you are liking my content or not if not then please tell me what should I do to be good at writing content. For comments choose the option I have given below

1. Good

2. Bad (if bad then where should I improve please do give me some suggestions.)

3. Average (Please Tell me what should i do to be good at writing)