Home » JavaScript » JavaScript : Execution Context ,Call Stack ,JavaScript Execution ?(Important to Understand)

JavaScript : Execution Context ,Call Stack ,JavaScript Execution ?(Important to Understand)

Hello Guys, It is your first day to start the javascript. Everyone Directly starts Javascript by learning the syntax rather than what is happening in the backend and how the javascript works. So, in this blog, we are looking at how the javascript works in the backend.

Important Quote I Heard on the Internet :

“Everything happen in Javascript ,inside The Execution Context.”

What is Execution Context?

We can Call Execution Context as simple as a Box, where it stores the code and executes it.

The image shows What the Execution Context looks like.

Step 1:

2:

3:

4:

5:

The New Local Execution context is create for every single function and it get executed when it call and stored the output in varible or we can display it .

Also Read : How to Convert the Values to String in Javascript

What is Execution stack / Call Stack ?

Call Stack Maintain the Order of Execution of Execution Context

The Execution context is work in Stack so , the Stack we used called as Execution stack / Call Stack .Below is image of above code how the code is Executed in call stack.

Flow Cart to Explain the Execution of Javascript code ?

The Above Explaination can Answerd the Below Question ?

1.Hoisting in Javascript ?

  • Hoisting is a JavaScript behavior where variable and function declarations are moved to the top of their containing scope during the compilation phase.
  • This allows you to use variables and functions before they are declared in the code.
  • However, only the declarations are hoisted, not the initializations.

2 . Why functoin call can be done before the functoin is written in javascript ?

  • Function declarations are hoisted in JavaScript, so the entire function, including its body, is moved to the top of the scope during compilation.
  • This enables you to call a function before its actual declaration in the code.
For example:
javascript
myFunction(); // This works even though myFunction is declared later in the code

function myFunction() {
console.log("Hello, world!");
}


However, this behavior does not apply to function expressions or arrow functions assigned to variables. (Important)

Also read: How to Set Default Values in Javascript

3.How can understanding hoisting be beneficial in debugging JavaScript code?

  • Helps explain unexpected behavior when functions or variables seem to be accessible before their declaration.
  • Facilitates identifying and resolving issues related to variable and function scope.
  • Aids in understanding the flow of code execution during debugging sessions.

4.What is the difference between function declarations and function expressions regarding hoisting?

AspectFunction DeclarationsFunction Expressions
Hoisting BehaviorEntire declaration is hoisted to the top.Only variable declaration is hoisted, not the function.
Can be called before declaration in the code.YesNo
Usage Syntaxfunction name() { }var variableName = function() { }

List of Some important Leet code Questions:

Leave a Reply