我已经尝试在互联网上搜索导入模块的执行顺序.例如,假设我有以下代码:
import "one" import "two" console.log("three");
其中one.js和two.js定义如下:
// one.js console.log("one"); // two.js console.log("two");
控制台输出是否保证是:
one two three
还是未定义?
解决方法
导入的ES6模块是异步执行的.但是,所有导入都在脚本执行导入之前执行.这使得ES6模块与例如
Node.js modules或
<script>
tags不同,具有async属性. ES6模块在加载时更接近
AMD specification.有关详细信息,请参阅Axel Rauschmayer探索ES6的
section 16.6.1.
所以,在上面提供的例子中,执行顺序是无法保证的.有两个可能的结果.你可能会看到:
one two three
或者你可能会看到:
two one three
换句话说,两个导入的模块可以按任何顺序执行其console.log()调用;它们彼此是异步的.但是它们一定会在导入脚本之前执行,所以“三”保证最后被记录.
也就是说,no modern browser implements ES6 modules.我不知道像Babel这样的透明胶片是否遵循这方面的原始规格.
更新
在下面的@BenjaminGruenbaum’s评论中,我决定更仔细地研究一下.尽管有上述的来源,我在specification itself中没有明确指出模块加载是异步的(尽管不可否认,作为英语母语者,我发现这个规范有点难看).如果是这种情况,则执行导入的顺序将取决于实现.也就是说,同样的结论是:您不能指望以任何特定顺序执行的进口.