Before we talk about the execution context let's see those simple two piece of code and let's discuss the output of "Console.log(a)" 


 1-

 

 2-

 

You think that they will have the same output because in the first case we don't have the variable yet and in the second case we have defined the variable but after we tried to get its value right ?

 

The answer is : No

First code you will get compilation error

And in the second code you will see variable have special value 'undefined'.


 So it looks like JavaScript defined our variable first before executing the code. And some people call this "hoisting phenomena" as if the JavaScript defined the variable at the beginning of the code and set it with special value for us before executing the code.


 

Actually they are different cases and this is because of how the JavaScript engine work.

 

Let's see how JavaScript engine work :

JavaScript engine parse the code first and then it creates the code execution context and then it start executing the code. So we have two phases


Creation phase (hoisting)

In this phase JavaScript engine prepares the context by reserving places in memory for all variables and functions and in case of variables it sets all variables in this phase with special JavaScript value called 'undefined' and this is a special value like null value and it's not compilation error and that explains why the above code cases are different.

For the 'Global Object' and 'this' and Outer Environment I'll discuss in detail in another post.

Execution phase

here where the code start executing 


reference : udemy