JavaScript Internal principle Series-execution context (execution contexts)

Profile

This article will introduce you to the execution context of ECMAScript and the associated executable code type.

Defined

Whenever the controller arrives at the ECMAScript executable code, the controller enters an execution context.
The execution context (abbreviation: EC) is an abstract concept that is used in the ECMA-262 standard to differentiate between different types of executable code.

The standard does not define the concrete structure and type of execution context from the perspective of technology implementation, which is an issue to be considered in implementing the standard ECMAScript engine.

The execution context of a series of activities logically forms a stack. The bottom of the stack is always the global context, and the top of the stack is the current (active) execution context. When switching between different execution contexts (exiting and entering a new execution context), the stack is modified (by means of a stack or a fallback).

Executable code type

The executable code type is related to execution context. Sometimes, when it comes to code types, it's actually about the execution context.

For example, we represent the stack of execution contexts in the form of arrays:

ECStask = [ ];

Each time the controller enters a function (even if the function is called recursively or as a constructor), the operation of the stack will occur. The built-in eval function is no exception when working.

Global Code

This type of code is handled at the "program" level: for example, loading an external JS file or inline JS code (included in the <script></script> tag). The global code does not contain any code in the body of the function.

At initialization time (program start), Ecstack is as follows:

ECStack = [    globalContext];

function code

Once the controller enters the function code (various functions), there will be new elements that will be pushed to the ecstack. Note that the Entity function code does not include the code for the intrinsic function. As shown below, we call a function that recursively calls itself once:

(function foo(bar){    if (bar){    return;}foo(true);})();

The Ecstack is then modified to resemble the following:

//首先激活foo函数ECStack = [     functionContext    globalContext];//递归激活foo函数ECStack = [     functionContext - recursively     functionContext    globalContext];

Each time the function returns and exits the currently active execution context, the ecstack is executed with the corresponding fallback operation-advanced-out-consistent with the traditional stack implementation. Similarly, when an uncaught exception is thrown, one or more execution contexts are exited, and the Ecstack does the corresponding fallback operation. After the code is complete, only one execution context (Globalcontext) is left in the Ecstack-until the end of the program.

Eval code

When it comes to the Eval code, it's more interesting. Here is a concept called the call context, such as: the context in which the Eval function is invoked, is a call context, and the actions performed in the Eval function (for example, a variable declaration or a function declaration) affect the entire invocation context:

eval(‘var x = 10’);(function foo(){    eval(‘ var y = 20’);})();alert(x); // 10alert(y); // ”y” is not defined

Ecstack will be modified to:

ECStack = [    globalContext];//eval(‘var x = 10’);ECStack.push(    evalContext,    callingContext: globalContext);// eval exited contextECStack.pop();//foo function callECStack.push( functionContext);//eval(‘ var y = 20’);ECStack.push(    evalContext,    callingContext:  functionContext);//return from evalECStack.pop();//return from fooECStack.pop();

In the implementation of version SpiderMonkey 1.7 or more (Firefox,thunderbird browser's built-in JS engine), allows the call context to be passed as the second argument to the Eval function when the Eval function is called. Therefore, if the incoming invocation context exists, it is possible to affect the private variables (variables declared in that context) that are in the contexts:

function foo(){    var x = 1;    return function() { alert(x); }};var bar = foo();bar(); // 1eval(‘x = 2’, bar); //传递上下文，影响了内部变量“var x”bar(); // 2

Summarize

These basic theories are necessary to analyze the context-sensitive details (such as variable objects, scope chains, and so on) that are later executed.

Extended Reading

Ecma-363-3 the corresponding section of the standard document--10. Execution context

JavaScript Internal principle Series-execution context (execution contexts)