knotri
knotri

Reputation: 253

Difference between Lexical Environments and Environment Records in modern ecmaScript

I try to understand how closure is working under the hood. So I've read a lot of documentation and so many different websites.

Then I read this Variable Environment vs lexical environment

And in old documentation (2011) https://262.ecma-international.org/5.1/#sec-10.2

there are two different things, LE and ER.

But in modern https://262.ecma-international.org/12.0/#sec-environment-records

There is only one, environment record, and description of it is very similar to the old describe of lexical environments/

So, I am really confusing. Does LE still exist for modern javaScript (ecmaScript 6+)? What the difference between LE and ER?

Upvotes: 2

Views: 749

Answers (1)

Yogesh Yadav
Yogesh Yadav

Reputation: 445

Let's first go through the definition of Lexical Environment & Environment Record as per different versions of ECMAScript Specification.

From ES2015 till ES2020 Specification:-

1. Lexical Environment:

  • A Lexical Environment is a specification type used to define the association of Identifiers to specific variables and functions based upon the lexical nesting structure of ECMAScript code.
  • A lexical environment is consists of two components:
    1. Environment Record
    2. Reference to outer environment

2. Environment Record:

  • An Environment Record records the identifier bindings that are created within the scope of its associated Lexical Environment. It is referred to as the Lexical Environment's EnvironmentRecord.

Conceptual look using pseudo-code:

context.environment = {
    // storage
    environmentRecord: { 
    <identifier> : <value>
    <identifier> : <value>
    }
    // reference to the parent environment
    outer: <...> 
}

Note: - The [[Environment]] created inside Execution Context is of type Lexical Environment[refer ES2020]


According to 12th Edition ECMAScript2021 Specification:

1. Environment Record

  • A Environment Record is a specification type used to define the association of Identifiers to specific variables and functions, based upon the lexical nesting structure of ECMAScript code.
  • Every Environment Record has an [[OuterEnv]] field, which is either null or a reference to an outer Environment Record.

Conceptual look using pseudo-code:

context.environment = {
    // storage
    <identifier> : <value>
    <identifier> : <value>
    // reference to the parent environment
    outer: <...>
}

Note: - The [[Environment]] created inside Execution Context is of type Environment Record[refer ES2021]


Let's also understand the Structure of execution context

Execution Context:

  • An Execution Context is a specification device that is used to track the runtime evaluation of the code.
  • To keeps the track of execution progress of its associated code, it needs various state components like LexicalEnvironment, VariableEnvironment, etc.

In pseudo-code:

ExecutionContext = {
    VariableEnvironment: { ... },
    LexicalEnvironment: { ... },
    // other components
}

Note:

Till ES2020 From ES2021
- The LexicalEnvironment component and VariableEnvironment component of an execution context are always Lexical Environments[refer ES2020] - The LexicalEnvironment component and VariableEnvironment components of an execution context are always Environment Records[refer ES2021]

So, Yes Lexical Environment still exists for Modern JavaScript[ES2021] but now the [[Environment]] created is of type Environment Records.

Upvotes: 2

Related Questions