How JavaScript works?
->JavaScript have many different and questionable behaviour comparing to other programming languages.
->Even its “Execution Process” might be very interesting and questionable , that’s why you have seen some code like as follows
console.log( “1” == 1 ) //output:true
In strict mode
console.log( “1” === 1 ) //output:false
Therefore, before delving into the core fundamentals of JavaScript, it is crucial to understand how it works, its code execution process, and the concept of execution context. This understanding proves invaluable when working with JavaScript.”✌️
Read my blog about these concept, it can make your understanding better and it has concise way of content it help you to learn these concept with some code snippets
How JavaScript works🤔?
->”Everything in JS happens inside Execution Context” keep this popular JS quote and truth in mind for life-long.
->Before diving deep into it, Just imagine “Execution Context” as a “Box”, it is divided into two components[sections/phases].
- > First Component — Memory Component
-> Second Component — Code Component
Where Execution Context Exist ?
Before moving to coding snippet part , Each Execution Context is located in “Global Execution Context”.
Don’t get worried or confused about what it is , we will discuss about detailly in upcoming blogs
Just Imagine “Global Execution Context” is a big container and “Execution Contexts” are minor containers within it.
Example Code Snippet to learn how it execute Behind The Scenes
var num1 = 10;
var num2=2;
function add(num1,num2){
var sum = num1+num2;
console.log(sum);
}
add(num1, num2);The Execution of above code in “Memory Allocation Phase”
In JS , Even before executing single line of code , it allocates memory for all the variables and functions existing in the program.The values are
->For Variables — “undefined”
->For Function — “Entire Function”
The Above memory allocation phase exist in “Memory Component” of Execution Context .
JS is Synchronous and Single-Threaded Language
Yes, JS is Synchronous and Single-Threaded language.So , you can raise a question , Then how we are performing “Async” task in JS. Don’t worry it is a seperate core of JS , we learn about that later blogs.
- When I said “Synchronous and Single-Threaded Language” , JS executes only one line of code at a time .It executes each line one by one.
- In the example code, when the program execution hits the last line of code it looks like following context
When JS Engine executes the code one line by one , it allocates it values for each variables.
Here We can see two execution context , that may raise a question🤔⁉️Now let us shortly discuss how a fuction executes?
How a Function executes in JS?
Functions are soul for JavaScript . It need seperate blog to explain how it behaves and executes. so for now , we just understand how it executes.
- Let us break code in snippets,
- When a function is invoked in JS, it creates a new “Execution Context” within existing Execution context.
- That’s is why we have a new execution context in that image.
- Within that Execution context, it has it own variables which is “sum” here.
- It executes its code one by one in that inner“Execution Context”
What happens when program executed completely?
When program executed completely , the garbage collector removes all the executed code and empty the “Global Execution Context”
This is how Global Execution Context look like when execution got completed
Now let us wind up this topic, On the whole
- ”Everything in JS happens inside Execution Context” keep this popular JS quote and truth in mind for life-long.
- Each Execution Context is located in “Global Execution Context”.
- JS is Synchronous and Single-Threaded language, JS executes only one line of code at a time .It executes each line one by one.
- When a function is invoked in JS, it creates a new “Execution Context” within existing Execution context.
- When program executed completely , the garbage collector removes all the executed code and empty the “Global Execution Context”
“In summary, we’ve learned about how JavaScript works, the concept of execution context, and the fact that JavaScript is synchronous and single-threaded.”
In upcoming blogs, we will delve deep into the basic and core concepts of JavaScript. Understanding the intricacies of JavaScript, including its unique behaviors and the execution process, is essential for any developer. With a solid foundation in these concepts, you’ll be better equipped to tackle the challenges and complexities that arise when working with JavaScript. Stay tuned for more in-depth insights into the world of JavaScript!
Cheers, Anthony Irudhaya Aakash😀✌️
