SCOPE->

1. Global - Function, variables, Objects which could be accessable from anywhere.

2. Function - Variable and Objects accessible only inside the function.

3. Module - The scope for code running in module mode.

Call Stack->

To understand call stack first we need to understand the basics of code execution.

GLOBAL EXECUTION ->

JavaScript creates the global execution context before it starts to execute any code. means every object, every variable, every function which is not inside any function comes under global execution. Here everything belongs to global object i.e for console window object.

let name = 'Rohan'; // global variable could be accessed from anywhere

function human(){
    let sayname = 'agrawal';   // function variable could be access inside function only.
    console.log(sayname);
}

EXECUTION CONTEXT ->

The enviroment in which the perticular function get executed.

CALL STACK ->

So call stack is similar to stack in data structure that works on LIFO order but here it stores first the global execution context i.e window object or global object. Then as soon as the program executes which Function will run first its reference is stores in call stack(Execution context) and it goes on. As soon as a Function is executed it goes out of call stack but in LIFO order.

SINGLE THREAD ->

const one() {
      console.log("Hello");
}
const two () {
    for(i=0; i<= 100000000000000000000000; i++){
}
const three(){
       console.log("World");
}
one();
two();
three();

So in above code First one(),then two(), then three() will run. then in two() function will JavaScript engine wait for that long loop run? yessss It is how JavaScript is design to work it is called Synchronous.
JavaScript is a single threaded language that can be non-blocking. Single threaded means it has only one call stack. Whatever is on the top of the call stack is run first.

HOISTING ->

Points to Remember -

1. All declaration of both variables and functions are processed before any part of code is executed see in image- 2.Variable declaration are scanned and made Undefined.

1. Function declaration are scanned and made Available.

Here is example of hoisting in functions-

tipper(80);
function tipper(a){
    let bill = a;
    console.log(bill+5);
}

Here by rule 3 firstly function declaration will execute first then its call. so it becomes

function tipper(a){
    let bill = a;
    console.log(bill+5);
}
tipper(80);

but you will be surprised here->

Here in code 1 firstly code declaration takes place then tipper(80) gets the Reference of function (remember this), then it make a call.

BUT in code-2 bigtipper(200) does not work it gives error that bigtipper is not a function .

Why does it give error it should work ?? (think again).

SO Actually first in code-2 the function(a) gets declared but it did not executed (both are different) so after declaration bigtipper(200) did not get any reference (unlike in code-1 in which tipper(80) gets reference after declaration ), then as var bigtipper gets its declaration has it gets reference of function(a) then it can make a call.

In short ->

• Code - 1 works because at the time function calling, caller has reference of function.
• Code- 2 first code give error because at the time function calling, caller has not reference of function.