Most developers memorize the definitions of Lexical Scope, Lexical Environment, Scope Chain, and Closure without understanding what actually happens inside the JavaScript engine.

In this article, we'll build these concepts step by step and understand them from the engine's perspective.

What Does "Lexical" Mean?

Lexical means:

"Based on where things are written in the source code."

JavaScript determines variable access by looking at the physical location of functions in your code—not where they are called.

A Lexical Environment is an internal object created whenever JavaScript starts executing a scope.

It stores:

• Local variables


• Function declarations


• A reference to its parent lexical environment

It consists of:

• 
  Environment Record → Stores variables and functions


• 
  Outer Reference → Points to the parent lexical environment

Together, these make variable lookup possible.

Scope Chain

The Scope Chain is formed by connecting lexical environments through their Outer References.

When JavaScript can't find a variable in the current scope, it walks up this chain until it either finds the variable or reaches the global scope.

Easy Way to Remember

Lexical Scope is the rule that defines what a function can access.

Lexical Environment is the place where those variables are actually stored.

Interview Definition

Lexical Scope defines what a function can access, while the Lexical Environment stores those variables and maintains the relationship between parent and child scopes.

Example

const globalVar = "I am Global";



function outerFunction() {

  const outerVar = "I am Outer";



  function innerFunction() {

    const innerVar = "I am Local";



    console.log(innerVar);

    console.log(outerVar);

    console.log(globalVar);

  }



  innerFunction();

}



outerFunction();

Output

I am Local

I am Outer

I am Global

What Happens Behind the Scenes?

When innerFunction() starts executing:

JavaScript creates a brand new Lexical Environment.

It contains:

Lexical Environment (innerFunction)



Environment Record

------------------

innerVar



Outer Reference

      ↓

Lexical Environment (outerFunction)



Environment Record

------------------

outerVar



Outer Reference

      ↓

Global Lexical Environment



Environment Record

------------------

globalVar

Now suppose JavaScript needs outerVar.

The lookup process becomes:

Current Scope

      ↓

Parent Scope

      ↓

Global Scope

This lookup path is called the Scope Chain.

When we return an inner function, pass it as a callback, or store it in a variable, and it carries its lexical environment along with it, that is called a Closure.

Example

function outerFunction() {

  let a = 10;



  function innerFunction() {

    a++;

    console.log(a);

  }



  return innerFunction;

}



const fn = outerFunction();



fn();

fn();

fn();

Output

11

12

13

Why Doesn't a Disappear?

Normally, when outerFunction() finishes execution, its execution context is removed from the call stack.

But JavaScript notices that innerFunction still needs a.

Instead of destroying that memory, JavaScript keeps the lexical environment alive.

The returned function holds a hidden reference to it.

This preserved relationship is called a Closure.

One Snap > 100 Closure Definitions 📸

Someone asks:

"Where is the closure?"

Open Chrome DevTools:

console.dir(fn)

Expand:

[[Scopes]]



Closure (outerFunction)

{

    a: 13

}

There it is.

That hidden Closure object is the preserved lexical environment that keeps your variables alive even after the outer function has returned.

⟶ Lexical means where code is written.

⟶ Scope is determined during parsing, not during function calls.

⟶ Every executing scope gets its own Lexical Environment.

⟶ Lexical Environments are connected through Outer References.

⟶ Those references create the Scope Chain.

⟶ A Closure keeps a lexical environment alive as long as a function still references it.

If this article helped you understand what's happening inside the JavaScript engine, consider leaving a ❤️ and sharing it with fellow developers.

Happy Coding!