Introduction

Welcome to this weeks entry of my WILLW series. Today, I'm going over the basics of execution context.

What is the execution context

In JavaScript, execution context is an abstract concept that holds information about the environment within which the current code is being executed.

Types of execution context

There are three types of execution context and we are going to focus on two.

• Global Execution Context
• Function Execution Context

First, Global Execution Context is the default execution context in which JavaScript code start its execution when the file first loads in the browser.

All of the global code i.e. code which is not inside any function or object is executed inside the global execution context. GEC cannot be more than one because only one global environment is possible for JavaScript code execution as the JavaScript engine is single threaded.

Remember, a call stack is a mechanism for an interpreter (like the JavaScript interpreter in a web browser) to keep track of its place in a script that calls multiple functions — what function is currently being run and what functions are called from within that function, etc.

Next up, we have the Function Execution Context which is defined as the context created by the JavaScript engine whenever it finds any function call. When a function executes, an execution context is created and virtually placed on top of the global execution context, the stacking of execution context is, again, called the call stack. Once a function has finished executing, it gets popped off of the call stack.

The two phases of execution context creation

The creation of a execution context occurs in two phases

1. Creation
2. Execution

The creation phase

When a script executes for the first time, the JavaScript engine creates a Global Execution Context. During this creation phase, it performs the following tasks:

Create a global object i.e., window in the web browser or global in Node.js.
Create a this object binding which points to the global object above.
Setup a memory heap for storing variables and function references.
Store the function declarations in the memory heap and variables within the global execution context with the initial values as undefined.

The Execution Phase

During the execution phase, the JavaScript engine executes the code line by line. In this phase, it assigns values to variables and executes the function calls.

That is it for this entry!