为什么链接到 Promise.resolve() 的 .then() 允许重新分配 const 声明？

Question

鉴于使用const 声明的变量无法重新分配或删除，请参阅

• Are there constants in JavaScript?

• JavaScript const Keyword

• Is it possible to delete a variable declared using const??

为什么可以在传递给.then() 的函数中为使用const 声明的变量重新分配值，该函数链接到Promise.resolve()，其中传递了const 变量，但无法重新分配@987654329 @ 函数传递给.then() 的变量链接到Promise 构造函数，其中const 变量传递给resolve() 参数Promise 构造函数resolver 函数？

"use strict"
const state = "123";
Promise.resolve(state)
.then(state => {
  console.log(state); // `"123"`
  state = 456; // reassign `const` variable `state` to `"456"`
  return state
})
.then(state => console.log(state)) // `"456"`
// not reached
.catch(err => console.error(err.message));

{
  "use strict";
  const state = "123";
  new Promise(resolve => {
    console.log(state); // `"123"`
    state = "456"; // reassign `const` variable `state` to `456`
    resolve(state);
  })
  .then(state => {
    console.log(state);
  })
  // `Error: Assignment to constant variable.`
  .catch(err => console.error(err.message)); 
}

---

编辑，更新

为了阐明调查的基础和动机，该问题试图确定何时可以使用与 const 声明相同的标识符，以及何时无法使用该程序。本质上，尝试创建一个标识符，该标识符会在尝试为标识符分配不同值的任何范围内引发错误——无论是函数范围、块范围还是代码中的任何位置——“superconst”标识符，或者最接近当前可能的描述，具体取决于引擎。 Map 或 WeakMap 或 class 是我们目前在最新浏览器实现中最接近的吗？

Answer 1

您没有分配给const 变量。相反，您正在分配给您提供相同名称的函数参数。该函数参数是变量的非常量副本，因此您可以分配给它。

我将尝试将我所有的 cmets 收集到一个更充分解释的答案中。

这里的代码：

"use strict"
const state = "123";
Promise.resolve(state).then(state => {
  console.log(state); // `"123"`
  state = 456; // reassign `const` variable `state` to `"456"`
  return state
}).then(state => console.log(state)) // `"456"`
  // not reached
.catch(err => console.error(err.message));

首先，定义const state = "123" 变量。任何更改该确切 state 变量内容的尝试都将引发异常。

然后，当你这样做时：

Promise.resolve(state).then(state => {

这声明了一个.then() 处理函数，它接受一个参数并且该参数的名称是state。当调用.then() 处理程序时，作为该参数传递给.then() 处理程序的任何内容都将复制到这个名为state 的新参数变量中。函数参数不是const。他们可以被分配到。

因为您现在已经创建了两个具有相同名称的单独变量并且一个位于更高范围内，所以当您在 .then() 处理程序中时，名为 state 的函数参数“覆盖”或“隐藏”另一个同名变量。当您尝试在 .then() 处理程序中访问 state 时，使用该名称时您可以访问的唯一变量是函数参数。该函数参数是另一个状态变量的副本，因为它作为参数传递给.then() 处理程序。所有函数参数都是副本。 Javascript 没有真正的引用变量类型。

此外，函数参数不是const，因此您可以分配给它们。

因此，当您在 .then() 处理程序中使用 state = "456"; 时，您只是分配给函数参数。因为您已经创建了命名冲突，所以实际上无法访问更高范围的 const state 变量。 JS 解释器会找到在范围内最接近您尝试访问它的定义。

---

我认为，如果您停止创建有冲突的变量名，您的困惑就会迎刃而解。如果你这样做（命名参数localState）：

"use strict"
const state = "123";
Promise.resolve(state).then(localState => {
  console.log(state); // `"123"`
  state = 456; // reassign `const` variable `state` to `"456"`
  return state
}).then(state => console.log(state)) // `"456"`
  // not reached
.catch(err => console.error(err.message));

然后，当您尝试分配给state 时，您将看到一个异常，因为您没有创建具有相同名称的冲突局部变量，因此您尝试分配state = 456 确实会尝试分配给@987654345 @变量，解释器会反对。

---

据我所知，Javascript 无法阻止在本地范围内使用新声明的同名变量覆盖更高范围的变量。那不是语言功能。当解释器解析变量名时，它会搜索从局部到全局的范围层次结构，因此首先找到（并使用）局部定义。更高范围的定义在该范围内被“覆盖”或“隐藏”。这就是他们设计变量名称解析以在该语言中工作的方式。

这样做也有很多好处，因为有人突然声明了一个您没有使用或什至不知道的更高范围的变量，这永远不会意外地破坏您的更低范围的声明。当您自己声明冲突并且您实际上想要使用更高范围的命名时，这只是一个编码错误。如果您打算使用同名的更高范围的变量，则不必声明冲突的名称。

Answer 2

这里的常量state 变量没有改变。您正在更改传递给 resolve 函数的参数值。您可以通过简单地执行console.log(state) 来验证这一点，因为您的所有代码和输出都是123。