为什么导入后变量变成了常量？答案

【问题标题】：Why does after the import a variable became a constant?为什么导入后变量变成了常量？
【发布时间】：2023-02-17 13:41:06
【问题描述】：

包.json

{
  "type": "module"
}

用户.js

let users = ["Jack", "Mary"];

export default users;

索引.js

import users from './users.js';

users = [];

执行 index.js 后出现错误：

users = [];
      ^

TypeError: Assignment to constant variable.

为什么？ users 被明确定义为变量而不是常量。

【问题讨论】：

你为什么要重新分配它？这看起来很像XY Problem。来自docs'静态导入语句用于导入只读由另一个模块导出的实时绑定。
这只是一个简化的例子，以便更好地理解。我也很好奇这里发生了什么。你能让我好奇吗？
请参阅文档链接，无论它们在模块中如何声明，导入的绑定都是只读的。也就是说，模块内的 let 对于模块范围内的重新分配可能很重要。但是重新分配导入的绑定会断开变量与模块的连接，从而失去其实用性。如果你需要一个副本，你可以克隆导入的数组let userCopy = [...user];
万分感谢！事实证明，我应该在模块内部重新分配这个数组的值。

标签： javascript

【解决方案1】：

  import users from './users.js';

类似于

const users = ...

因为您不能在之后分配值。这并不完全相同，因为值可以更改，但只能从模块内部更改。所以在 users.js 里面

let users = [];

export const setUser(newUsers) {
  users = newUsers
}

export {users, setUser);

索引.js

import {users, setUser} from './users.js'

console.log(users);
console.log(setUser(["a", "b", "c"]));

【讨论】：

对不起。我没有测试这个。只是一个简单的例子。
你可以变异导入后的用户，您无法重新分配。所以一个更好的例子是 setUser(newUser){ users = newUser }; 实际重新分配。
重要的是要记住该模块可以重新分配它们（这就是“实时绑定”的意思），所以它不太像const。（export let test = 0; export function inc () { test++ }，import { test, inc } from './stuff.js'; console.log(test); inc(); console.log(test)将要打印01!) - 但是这样做不是使用默认导出，仅命名导出。

【解决方案2】：

正如@pilchard 所解释的那样，为了完成我的任务，我需要更改模块内的这个数组。那是因为我导入的值在模块外是只读的。 Docs。

用户.js

let users = ["Jack", "Mary"];

function emptyUsers() {
    users = [];
}

export { users, emptyUsers };

索引.js

import { users, emptyUsers } from "./users.js"
console.log(users); // ["Jack", "Mary"]

emptyUsers(); // instead of users = [];
console.log(users); // []

users.push('Ricky'); // Also I can still change the values of the imported array
console.log(users); // ['Ricky']

【讨论】：