How JavaScript Works (Part 2) – Execution Context & Call Stack Explained in Simple Words

DEV Community

So now, call Stack becomes:


| displayUserDetails |
| Global |

Now:

Age: 27
Designation: Software Engineer

After finishing the execution of this function:

Call Stack:

| Global |

JavaScript always executes the function that is on the top of the Call Stack.

That’s why it follows LIFO.

Full Name: Munzah Shah
Age: 27
Designation: Software Engineer

If you understand:

You will easily understand:

And that’s when JavaScript truly starts making sense.

JavaScript creates a Global Execution Context (GEC) when a program starts running.
Every execution context goes through two phases:
Creation Phase (memory allocation)
Execution Phase (code runs line by line)
Variables and function definitions are stored in memory during the creation phase.
Each function call creates a new Function Execution Context (FEC).
Every execution context contains:
Its own memory
A thread of execution
JavaScript uses a Call Stack to manage execution contexts.
The Call Stack follows the **Last In, First Out (LIFO) **principle.
The function at the top of the stack is executed first.
Once a function finishes execution, it is removed (popped) from the stack.
The Global Execution Context remains until the program finishes running.
Understanding execution context and call stack makes advanced concepts like hoisting, closures, and async JavaScript easier to understand.