What has changed in Lexical Environment as per ECMAScript2021
Explore the lexical Environment & Environment Record in Javascript 2021
Photo by Paul Skorupskas on Unsplash
Table of contents
No headings in the article.
Let's first understand the Lexical Environment
& Environment Record
as per different versions of ECMAScript Specification.
From ES2015 till ES2020 Specification:-
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 your code.
- A lexical environment consists of two components:
Environment Record
It 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.Outer Reference
A reference to outer environment (null in the global environment).
A conceptual view using pseudo-code:
executioncontext.environment = {
environmentRecord: {
// storage
<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:
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 your code.
- Every Environment Record has one component:
Outer Reference
An[[OuterEnv]]
field, which is either null or a reference to an outer Environment Record. A conceptual view using pseudo-code:executioncontext.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] |
Summary
Let's have a quick recap of all the steps we perform in the above code snippet.- In ECMAScript2021, the
[[environment]]
which is created inside the execution context is oftype
Environment Record instead of Lexical Environment. - So, The
LexicalEnvironment component
andVariableEnvironment components
of an execution context are always Environment Records.
Wrap Up!!
Thank you for your time!! Let's connect to learn and grow together.Github Twitter
ย