为什么在 es2015 中出口/进口申报必须在顶层？

Question

我在上一个项目中开始使用带有 babel 的 es2015。当我尝试在if 条件内执行import 或export 时，出现错误'import' and 'export' may only appear at the top level。我看到很多这样的案例，它适用于require，但不适用于 es2015 模块。这种限制有什么原因吗？

Answer 1

JavaScript 对 ES6 模块执行静态分析。这意味着您不能动态执行导入或导出。 Read section 4.2 of this article for more information:

模块的结构是静态的意味着您可以在编译时（静态地）确定导入和导出——您只需要查看源代码，而不必执行它。

这种方法有很多原因，其中一些是为将来依赖源文件可静态分析能力的功能准备 JavaScript，即宏和类型（在上述文章中讨论过）。

另一个有趣的article on this topic 提到了循环依赖和快速查找作为原因。

______

如果您想在模块的某个嵌套块中执行export，请重新考虑您是如何编写模块并公开其 API/内部的，因为这几乎肯定没有必要。如果您当前在 ES5 代码的嵌套块中 requireing 模块，情况也是如此。为什么不在模块顶部require / import 并在嵌套块中使用它们的 API/内部？这种方法的主要优点是，至少从可读性的角度来看，您可以了解模块的依赖关系，而无需扫描其源代码以查找 require 调用。