kiran's blog

JavaScript Execution Context: A Closer Look

Kiran Kumar Rega's photo
Kiran Kumar Rega
·

3 min read

JavaScript is a synchronous, single-threaded language. This means that code is executed one line at a time, and only one line of code can be executed at a time.

Everything in JavaScript runs inside an execution context. An execution context is a container that holds all of the information needed to execute a piece of code, including variables, functions, and the current state of the program.

There are two phases of execution in JavaScript:

  1. Memory allocation: During this phase, the JavaScript engine allocates memory for all of the variables and functions that are used in the execution context.

  2. Code execution: During this phase, the JavaScript engine executes the code line by line.

Let's take a look at a simple example of how execution contexts work in JavaScript:

JavaScript

var n = 2;
function square(num) {
  var ans = num * num;
  return ans;
}

let squareTwo = square(n);
let squareFour = square(4);

When we run this code, the JavaScript engine will first allocate memory for the variables n, squareTwo, and squareFour. It will also store the complete function definition for square() in memory.

Next, the JavaScript engine will start executing the code line by line. On the first line, the value 2 is assigned to the variable n. On the second line, the JavaScript engine encounters a function call. The JavaScript engine will create a new execution context for the square() function. This new execution context will have its own set of variables, including the parameter num.

The JavaScript engine will then execute the code inside the square() function. The value of the num parameter is assigned to the variable ans. Then, the value of ans is returned from the function.

Once the square() function has finished executing, the JavaScript engine will destroy the execution context for the function.

The JavaScript engine will then continue executing the code in the original execution context. On the third line, the value of the square() function is assigned to the variable squareTwo. On the fourth line, the value of the square() function is again assigned to the variable squareFour, but this time with the parameter 4.

The JavaScript engine will then continue executing the code until it reaches the end of the script.

Execution contexts are a fundamental part of how JavaScript works. By understanding how execution contexts work, you can better understand how JavaScript code is executed and how to debug JavaScript code.

Here are some of the key takeaways from this blog post:

  • Everything in JavaScript runs inside an execution context.

  • Execution contexts have two phases: memory allocation and code execution.

  • The JavaScript engine creates a new execution context for each function call.

  • Execution contexts are destroyed when the function they are associated with finishes executing.

By understanding these concepts, you can better understand how JavaScript code is executed and how to debug JavaScript code.

credits : Namaste JavaScript By Akshay Saini

I embark on this journey as a blogger with eager anticipation of your insightful feedback.

JavaScript