JavaScript的词法环境如何在嵌套块范围内维护变量声明？

编程问答 2022-06-06

问题描述

我已经阅读了一些关于执行上下文的更全面的文章，现在我有点困惑和困惑。

为使问题尽可能简短，避免长时间被引用，我最好尝试通过以我无法获得的细节为重点的示例来说明我的心理模型，以便您纠正我并指出错误。

这里是一个例子：

var tomato = 'global tomato';

{
  let tomato = 'block tomato';
  console.log(tomato); // 'block tomato'
}

console.log(tomato); // 'global tomato'

到目前为止，一切都很清楚。当JS引擎创建执行上下文（在我们的示例中为全局上下文）时，第一行的var tomato声明被放入Variable Environment，而块范围内的let tomato则进入{{1} }。这就解释了我们最终得到了两个不同的西红柿。

现在，让我们添加另一个西红柿，就像这里：

Lexical Environment

var tomato = 'global tomato'; { let tomato = 'block tomato'; { console.log(tomato); // ReferenceError: Cannot access 'tomato' before initialization let tomato = 'nested block tomato'; } console.log(tomato); // won't reach here } console.log(tomato); // won't reach here 不足为奇。实际上，我们尝试在变量初始化之前访问它，这就是所谓的临时死区。这很好地表明JS已经在嵌套最多的块中创建了另一个@H_404_28@变量ReferenceError。另外，JS在我们引用它的时候就已经意识到该tomato尚未初始化。否则，它将从等于tomato的外部范围中夺取tomato而不会引发任何错误。因此，让我们修复错误并交换行，如下所示：

'block tomato'

我想知道JavaScript是如何管理这个最嵌套的块的。因为在执行到达该行时：

var tomato = 'global tomato'; { let tomato = 'block tomato'; { let tomato = 'nested block tomato'; console.log(tomato); // 'nested block tomato' } console.log(tomato); // 'block tomato' - still 'block tomato'. nothing has been overwritten. } console.log(tomato); // 'global tomato'

执行上下文的let tomato = 'nested block tomato';已包含变量Lexical Environment，该变量已在外部范围中用tomato的值初始化。假设JS不会仅为代码块创建新的执行上下文（分别具有Lexical和Variable环境）（这仅是函数调用和全局脚本的情况，对吗？），并且显然，它不会覆盖现有的变量'block tomato'，其名称相同但来自嵌套块作用域。如最后一段代码所示，在其中创建了一个全新的自变量来保存值Lexical Environment。

然后问题是此变量的确切位置是什么？我的意思是执行上下文只有一个'nested block tomato'，但我们可能会创建许多嵌套的作用域，在其中声明变量。我正在努力想象这些变量将存储在何处以及整个组件如何组合在一起。

解决方法

假设JS不会仅为代码块创建新的执行上下文（分别具有Lexical和Variable环境）（那只是函数调用和全局脚本的情况，对吗？）

那是一个错误的假设。

请参见the specification：

词法环境是一种规范类型，用于根据ECMAScript代码的词法嵌套结构来定义标识符与特定变量和函数的关联。词法环境由环境记录和对外部词法环境的可能为空的引用组成。通常，词汇环境与ECMAScript代码的某些特定语法结构相关联，例如FunctionDeclaration，BlockStatement或TryStatement的Catch子句，并且每次评估此类代码时都会创建一个新的词汇环境。

block语句创建了一个新的词汇环境。

,

在ECMAScript中，词法作用域可以嵌套。

我的意思是执行上下文只有一个词法环境，但是我们可能会创建许多嵌套的作用域来声明内部变量。

不，有一个词法环境可用于……每个词法环境。 （“作用域”毕竟是“环境”的不同术语。）

该规范并不强制实现者以任何特定方式实现它。一种典型的方法是链接环境列表。

callstackhoistingjavascriptlexicallexical-scope