The Execution Stack and Scope

What is the Execution Stack? Before I answer that question, we’ll first have to take a look at the Global Execution Context

The Global Execution Context, in general terms, is the environment in which the function gets invoked, or the variable’s scope. The Global Execution Context, creates global object, a window object, and a this variable in its creation phase as well as storing any variables you’ve made stored in memory.

The first function gets created on the global execution context called an, as you probably guessed, execution context and has its own space for variables and functions. The global execution context reads line by line until it comes to the next function. Every function creates a new execution context. Once there are no more functions to execute the top function on the execution context gets popped off. Whatever is at the top is currently running.

The Global Execution Context, then, is the outer portion of the Execution Stack or Call Stack. The functions that are invoked in the Execution Stack are lexically sitting on top of one another and being called from top to bottom. JavaScript is a synchronous language, which means the code you write gets executed line by line, from top to bottom.

function yourFunction() { var myVar = 68; yourFunction(); }

var myVar = 37; myFunction();

When this code is executed, since the scope chain can’t find myVar in function yourFunction() because it isn’t lexically in the local scope (remember your scopes) and the outer reference is in the global execution context, the console.log will display 37.

If we were to change where function yourFunction() sits lexically in the execution stack, for instance:

var myVar = 68;
yourFunction();

}

var myVar = 37; myFunction();

What is the Execution Stack? Before I answer that question, we’ll first have to take a look at the Global Execution Context

The Global Execution Context, in general terms, is the environment in which the function gets invoked, or the variable’s scope. The Global Execution Context, creates global object, a window object, and a this variable in its creation phase as well as storing any variables you’ve made stored in memory.

The first function gets created on the global execution context called an, as you probably guessed, execution context and has its own space for variables and functions. The global execution context reads line by line until it comes to the next function. Every function creates a new execution context. Once there are no more functions to execute the top function on the execution context gets popped off. Whatever is at the top is currently running.

The Global Execution Context, then, is the outer portion of the Execution Stack or Call Stack. The functions that are invoked in the Execution Stack are lexically sitting on top of one another and being called from top to bottom. JavaScript is a synchronous language, which means the code you write gets executed line by line, from top to bottom.

function yourFunction() { var myVar = 68; yourFunction(); }

var myVar = 37; myFunction();

When this code is executed, since the scope chain can’t find myVar in function yourFunction() because it isn’t lexically in the local scope (remember your scopes) and the outer reference is in the global execution context, the console.log will display 37.

If we were to change where function yourFunction() sits lexically in the execution stack, for instance:

var myVar = 68;
yourFunction();

}

var myVar = 37; myFunction();

This is how, under the hood, local and global scope function. For further information see: ECMAScript Docs