从 ES6 模块导入/导出数据时，该数据的可变性在命名导入和导出之间似乎有所不同。这是有原因的还是我不理解的一些根本区别？
// counter.js
export let count = 0;
export const incrementCount = () => count += 1;
export default count;
// main-default.js
import count, { incrementCount } from './counter';
console.log(count); // 0
incrementCount();
incrementCount();
console.log(count); // 0
// main-named.js
import { count, incrementCount } from './counter';
console.log(count); // 0
incrementCount();
incrementCount();
console.log(count); // 2
在这两种情况下，我都希望
count增加。但是，这只发生在使用命名导出时。
最佳答案
问题是你使用了export default count; ，不导出 count绑定(bind)(允许通过导入对可变变量进行别名)，但实际上创建了一个新的隐藏变量，该变量获取分配的初始值，但之后永远不会更改。
export default count;
脱糖
let *default* = count; // where *default* is a guaranteed collision-free identifier
export { *default* as default }
你想要的是
// counter.js
let count = 0;
export const incrementCount = () => count += 1;
export { count as default }
// main-default.js
import countA, { default as countB, incrementCount } from './counter';
console.log(countA, countB); // 0, 0
incrementCount();
console.log(countA, countB); // 1, 1
另见 How can I alias a default import in Javascript? .
关于javascript - ES6 命名导出和默认导出之间的可变差异，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/58437520/