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
Top comments (0)