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?
| Aspect | Function Declarations | Function Expressions |
|---|---|---|
| Hoisting Behavior | Entire declaration is hoisted to the top. | Only variable declaration is hoisted, not the function. |
| Can be called before declaration in the code. | Yes | No |
| Usage Syntax | function name() { } | var variableName = function() { } |
List of Some important Leet code Questions:
- Leet code 799. Champagne Tower
- LeetCode 389. Find The Difference
- Leetcode 775. Find The Global and Local Inversions
- Leetcode 316. Remove Duplicate Letters
- LeetCode 2233 Maximum Product After K Increments
- LeetCode 880. Decoded String at Index
- LeetCode 905. Sort Array By Parity
- LeetCode 896. Monotonic Array
- LeetCode 132. Pattern
- LeetCode 557. Reverse Words in a String III (easy)
- Leetcode 2038. Remove Colored Pieces if Both Neighbors are the Same Color
- Leetcode 1512. Number of Good Pairs (easy)
- Leetcode 706. Design HashMap (Easy)
- LeetCode 229. Majority Element II (Medium)