JavaScript中的export function()会被调用多次吗？

Question

我想知道这个是否

const getData = () => {
  const data = 1; // simplified complicated operations 
  return data;
};

export default getData();

这两者之间有性能差异吗：

const getData = () => {
  const data = 1;
  return data;
};

const toexport = getData(); // cache to a variable before exporting
export default toexport;

这个问题归根结底是关于导出实际工作方式的。我读了很多文章，可以让它工作，但我不明白它在幕后做了什么(找不到关于我的问题的文章)。

如果从不同的import导入导出，getData()会被调用一次还是每个导入都会调用？

function getData() {
  console.log('getData');
  return 1;
}

// will `export default getData();` be like this
const importSomeWhere = getData();
const importSomeWhereElse = getData();



// or this?
const exportCached = getData();

const importSomeWhere2 = exportCached;
const importSomeWhereElse2 = exportCached;

- Larry N

---

它只会被调用一次。 - Aluan Haddad

@AluanHaddad 谢谢你，你是怎么知道的？顺便问一下，有没有关于这个主题的建议文章。在 C++ 中，#include 的意思是复制和粘贴，当我在 C++ 中包含一个头文件时，我知道正在发生什么......但在 JavaScript 中，我不知道 import 和 export (有点相等) 是如何工作的。我只能找到关于导出和模块导出之间的区别、导出与导出默认值之间的区别等文章，但找不到关于它是如何工作的的文章。 - Larry N

模块是一个复杂的主题。在JavaScript中，它们具有特定的语义，而C++的包含完全不同，根本不是模块。顺便说一下，这是C++正在最终获得适当的模块系统的众多原因之一... 关于JavaScript，大部分关于模块的文献都是技术性的或过于简单化了。您可以从ECMAScript规范中了解到更多信息。至于我如何知道它，那就是浪费了我几年的时间去思考它，研究它，并与GitHub上的人讨论它。 - Aluan Haddad

Answer 1

它只会被评估一次。以下是当模块被导入两次时会发生什么的示例。

在increment.js中，我们声明了一个名为counter的变量。

let counter = 0;
counter++;

export default counter;

在consumer.js中，我们导入了两次，但计数器在第一次导入时只被评估一次。

import counter1 from './increment';
import counter2 from './increment';

counter1; // => 1
counter2; // => 1

- onmyway133