ES6模块中修改导入变量报错：能否为导入变量赋值？原因是什么？

你完全没操作错——这就是ES6模块导入的预期行为！你遇到的ReferenceError正是因为ES6模块的导入机制和普通变量赋值不一样，下面给你拆解清楚：

核心原因：导入的是「只读绑定」，不是普通变量 #

当你在moduleB里写import { a, b } from './moduleA'时，你拿到的不是a和b的副本，而是和moduleA里对应变量绑定在一起的只读引用：

• 你可以读取这个绑定指向的值（所以console.log(a)能正常输出5）；
• 但你不能直接修改这个绑定本身（也就是不能给a重新赋值），这会触发ReferenceError。

而且这个绑定是双向的：如果moduleA里自己修改了a的值（比如在moduleA里加一行a = 10），moduleB里读取的a也会跟着变成10——因为它们始终指向同一个变量。

怎么解决？两种常见方案 #

如果你确实需要在moduleB里修改moduleA的变量，有两种靠谱的方式：

方案1：导出修改函数（推荐用于单个变量） #

把修改逻辑封装在模块A里，导出一个专门的函数来修改变量：

// moduleA.js
let a = 5;
let b;
export { a, b };

// 导出修改a的函数
export function updateA(newValue) {
  a = newValue;
}

// moduleB.js
import { a, updateA } from './moduleA';

console.log(a); // 输出5
updateA(6);
console.log(a); // 输出6

方案2：导出对象（推荐用于多个关联变量） #

把需要共享的变量放在一个对象里，导出这个对象。因为对象是引用类型，你修改对象的属性不会改变绑定本身，所以是允许的：

// moduleA.js
export const sharedState = {
  a: 5,
  b: undefined
};

// moduleB.js
import { sharedState } from './moduleA';

console.log(sharedState.a); // 输出5
sharedState.a = 6; // 直接修改对象属性，合法
console.log(sharedState.a); // 输出6

内容的提问来源于stack exchange，提问作者croraf