Javascript: Execution Context ?

Pending --> callstack blogopst

Execution Context :

website used for the testing of this.

1. If we understand this concept we will be able to understand more difficult concepts such as
2. Hoisting
3. Scope
4. Scope chain
5. Closure

1. execution context

Creation :

• Global object, window, this,

Execution -> then we execute

function execution contect

• it will basically work like a call stack but for hte execution context -> you can say a local execution context is created here Creation and execution -> arguments -> this

Example of Execution Context

function first() {
    var username="first";
   console.log(username); 
  }


  function second() {
       var username = "second";
        console.log(username);
  }

  console.log(username);
  var username="sandy";

  first();
  second();
  console.log(username);

Output will be

undefined
first 
second 
sandy

How this works internally

1. Global execution context created , and the global object is created, stored in window and this also points at window username is given a undefined value and functions are stored int he mememory

2. Global execution context : execution : prints undefined since initializtion is in next line, first method is invoked,

3. when first menthod is invoked it will create the functional executional context,

4. function execution context, creation -> create arguments array, and local this keyword , undefined given to the username

5. function execution context execution, usernmae=first and then console.log --> first

6. function execution context finished it is moved out from the execution context stack

7. Now we invoke second method --> similar thing happen as happened in statement 3

1. Now when console.log(name ) initizixation done in global context it will print --> sandy

What will happen if the variable is not present in the functional context ?

• it will look in the parent execution context , and print that variable

function first() {

   console.log(username); 
  }

  var username="sandy";

  first();

in the above example it will print sandy since the username is not present in the functional execution context it will start looking in the parent execution context, and it it is not present int he parent, it will give refernece error,username is not defined.

Hoisting (Read it separately)

Scopes (Read it separately)

Scope Chain Lookup (Read it separately)

Closures

var count=0;

function outer(x) {

   return function inner(y) {

      return x+y;

   }

}

var adder=outer(5);
count=count+adder(2);

console.log(count);

Output

-> 7

Working of closures.

when we called outer(5) it will create the function execution context with value as 5 and once we return execution context of outer will be removed from the stack but closure scope will be created which means x=5 is still there, when we call the method --> adder(2) this will call the inner method with value 2 so 2 is there in the execution context but x will be taken up from the closure scope.

and hence this is how closure works.