Execution Context

Question 1

What is an execution context

Answer 1

An execution context is the process by which JS executes code. During the context runtime, the parser parses the source code and allocates memory for the variables and functions. The source code is generated and gets executed.

Question 2

How many types of execution contexts are there and what are they called?

Answer 2

There are two types of execution contexts: global and function.

2. The global execution context (obExCo) is created when a JavaScript script first starts to run, and it represents the global scope in JavaScript.
3. A function execution context (funcExCo) is created whenever a function is called, representing the function’s local scope.

Question 3

What are the phases of an execution context?

Answer 3

There are two phases of JavaScript execution context:

1. Creation phase: In this phase, the JavaScript engine creates the execution context and sets up the script’s environment. It determines the values of variables and functions and sets up the scope chain for the execution context.
2. Execution phase: In this phase, the JavaScript engine executes the code in the execution context. It processes any statements or expressions in the script and evaluates any function calls.

Question 4

How does an execution context organize itself?

Answer 4

It is divided into two components. One is memory and the other is code. It is important to remember that these phases and components are applicable to both global and functional execution contexts.

Question 5

What happens during the creation phase?

Answer 5

1. Creates a global object that is window in the browser and global in NodeJs.
2. Sets up a memory for storing variables and functions.
3. Stores the variables with values as undefined
4. Stores function references.

Question 6

What happens to variables during the execution phase?

Answer 6

It starts going through the entire code line by line from top to bottom. As soon as it encounters (for example) n = 5, it assigns the value 5 to ‘n’ in memory. Until now, the value of ‘n’ was undefined by default.

Question 7

What happens to functions during the execution phase?

Answer 7

1. As the function has been allocated in memory, when it gets to the invocation line it will create a new function execution context.
2. The functional execution context has access to all the code of the global execution context though vice versa is not applicable.
3. Once completed, the function will return any values, and this function execution context will be destroyed.

Question 8

What happens when a function is invoked?

Answer 8

The function execution context is created and has two stages:
1. creation stage
2. execution stage

Question 9

What happens during the function creation stage?

Answer 9

1. Creation phase is the phase in which the JS engine has called a function but its execution has not started. In the creation phase, JS engine is in the compilation phase and it just scans over the function code to compile the code, it doesn’t execute any code.
2. Creates the Activation/Variable object
3. Creates the scope chain object
4. Determines the value of the ‘this’ keyword

Question 10

What is an activation/variable object and when is it created?

Answer 10

The activation/variable object is created during the creation stage of function execution context.

The activation/variable object is a special object in JS which contain all the variables, function arguments and inner functions declaration information.

Question 11

What is the syntax of the function execution context (funcExCo) object?

Answer 11

executionContextObj = {
Arguments: {},
   variableObject: {},
   scopechain: [],
   this
}

Question 12

What is the scope chain?

Answer 12

Scope in JavaScript is a mechanism that determines how accessible a piece of code is to other parts of the codebase. Scope answers the questions: from where can a piece of code be accessed? From where can’t it be accessed? What can access it, and what can’t?

Each Function Execution Context creates its scope: the space/environment where the variables and functions it defined can be accessed via a process called Scoping.

The JavaScript engine traversing up the scopes of the execution contexts is called the scope chain.

Question 13

In a funcExCo where are the function arguments stored?

Answer 13

ArgumentObject in the variableObject

Question 14

In funcExCo What is the syntax for an variable object during creation phase?
~~~
function funA (a, b) {
var c = 3;

var d = 2;

d = function() {
return a - b;
}
}

funA(3, 2);
~~~

Answer 14

variableObject = {
  argumentObject : {
    0: a,
    1: b,
    length: 2
  },
  a: 3, // taken from arguments
  b: 2 // taken from arguments
  c: undefined,
  d: undefined then pointer to the function defintion of d ??????
}

Question 15

How are functions handled during creation phase of funcExCo?

Answer 15

When JS engine encounters a function definition inside the current function, it will create a new property by the name of the function. Function definitions in the creation phase are stored in heap memory, they are not stored in the execution context stack. Function name property points to its definition in the heap memory.

Question 16

What happens during the execution phase of funcExCo?

Question 17

During the global creation stage how are functions handled?

Answer 17

For every function declaration, a property is added to the variable object, pointing to that function, and that property is stored in memory. This means that all the function declarations will be stored and made accessible inside the VO, even before the code starts running.

Question 18

What is hoisting?

Answer 18

Function and variable declarations are hoisted in JavaScript. This means that they are stored in memory of the current Execution Context’s VO and made available within the Execution Context even before the execution of the code begins. (Except const and var)

Question 19

Hoisting does not work for function expressions, why?

Answer 19

Hoisting only works for function declarations, not expressions. Here is an example of a function expression where the code execution will break. Hoisting is part of the creation phase whereas function expressions are part of the execution phase.

Question 20

How does hoisting work for let and const? And what will happen if you try to access these variables, before they’ve been assigned a value?

Answer 20

Variable hoisting does not work for variables initialized with the let or const keyword. Trying to access a variable ahead of declaration and use the let and const keywords to declare it later will result in a ReferenceError.

Question 21

What is the name for the period during execution where let/const variables are hoisted but not accessible?

Answer 21

Temporal Dead Zone

Question 22

When a function is defined in another function, the inner function has access to the code defined in that of the outer function, and that of its parents. What is this behavior is called?

Answer 22

Lexical scoping

Question 23

What is the arguments object?

Answer 23

A key:value pair of parameters anticipated inside a function is stored in the arguments object. It also has a default property called length, which counts how many parameters that function has. When the function’s argument is empty, the argument object defaults to a length: 0.

Question 24

During the creation phase, two-state components are created:
Lexical Environment
Variable Environment
What are they used for? ??????

Answer 24

A Lexical Environment component is a structure based on the lexical nesting structure of JavaScript code that defines the association of identifiers to the values of variables and functions. Binding is the process of associating an identifier with the values of variables and functions.

A Variable Environment component is a Lexical Environment that defines the relationship between identifiers and the values of variables, but not functions.

The difference between these two is that the identifier is bounded in the variable. The Lexical Environment stores identifier bindings to the values of variables (let and const) and functions, whereas the Variable Environment simply stores identifier bindings to the values of the variable (var).