Javascript 为什么重新分配导入的对象会引发ReferenceError？

为什么我不能在

myAsyncFunction

中重新分配dataObj，即使它是在不同的文件中用

let

定义的，但如果我调用与

dataObj

定义在同一文件中的

changeDataObj

，它就可以工作。这是预期的行为还是我遗漏了什么

codesandbox.io的链接

请检查浏览器控制台而不是内置代码沙盒控制台以查看错误

为什么我不能在

myAsyncFunction

中重新分配dataObj，即使它是用let-in定义的不同文件

答案在您收到的另一条错误消息中：

“dataObj”是只读的

所有导入都是只读的。它们是如何定义的并不重要。

ReferenceError

可能是由于代码的转换方式造成的

但是如果我调用与

dataObj

定义在同一文件中的

changeDataObj

---

因为

dataObj

在该文件中是一个正常的

let

绑定。

如果您只是想让一个名为

dataObj

的局部变量（这可能不是一个好的选择，但我假设是这样），那么您的语句需要一个

let

：

//fileB.js
import {dataObj, changeDataObj} from "./fileA.js";

const myAsyncFunction = async () => {
   const response = await myApiCall();
   console.log(dataObj); // {name: "initial name"}
   console.log(response); // {name: "name from api"}
   dataObj = Object.assign({}, response); 
   // Throws ReferenceError: dataObj not defined on my computer with Webpack, babel
    // throws Error: "dataObj" is read-only. in codesandbox.io vanilla template using parcel. Codesandbox link https://codesandbox.io/s/nrn9o71jmm

   // but,
   changeDataObj();
   console.log(dataObj); // {name: "changed in changeDataObj fn"}
}

然后全局

dataObj

被忽略，您将获得一个新变量。不过，我认为这可能真的令人困惑

---

正如Felix解释的，所有导入都被标记为只读，因此无法分配新值。这实际上是一个很棒的功能。

谢谢你的回答。这是一个网页包抛出

引用错误：dataObj未定义

，而不是说

只读

，这在包中似乎是正确的。这与

异步函数

无关，但分配目标来自模块

导入

。

//fileB.js
import {dataObj, changeDataObj} from "./fileA.js";

const myAsyncFunction = async () => {
   const response = await myApiCall();
   console.log(dataObj); // {name: "initial name"}
   console.log(response); // {name: "name from api"}
   dataObj = Object.assign({}, response); 
   // Throws ReferenceError: dataObj not defined on my computer with Webpack, babel
    // throws Error: "dataObj" is read-only. in codesandbox.io vanilla template using parcel. Codesandbox link https://codesandbox.io/s/nrn9o71jmm

   // but,
   changeDataObj();
   console.log(dataObj); // {name: "changed in changeDataObj fn"}
}

let dataObj = Object.assign({}, response);