时间戳

首页 > 解决方案 > ES6 导入的执行顺序，在 HTML 和代码中

javascript - ES6 导入的执行顺序，在 HTML 和代码中

问题描述

如果我有以下情况：

<script type="module" src="one.js"></script>
<script type="module" src="two.js"></script>
<script type="module" src="three.js"></script>
  1. 我是否正确地说你不能 100% 确定这three.js将在之后 one.js执行two.js？

但是，如果我有：

<script type="module">
  import 'one.js'
  import 'two.js'
  import 'three.js'
</script>
  1. 我是否正确地说我可以确信three.js将在之后 one.js执行two.js？（这个很重要）

关于可能重复的评论

我知道这看起来像是一个重复的问题，但请记住，这个问题的目的是确认通过 HTML 和通过 JavaScript 导入的非常不同的行为

标签： javascriptes6-modules

解决方案

我是否说您不能 100% 确定 three.js 将在 one.js 和 two.js 之后执行？

是的，因为例如 three.js 可能已经在 one.js 中导入，并且模块只评估一次。

我是否可以确信three.js 将在one.js 和two.js 之后执行？（这个很重要）

不，出于与上述相同的原因。

在导入模块的两种方式中，如果之前没有导入任何模块，那么它们将按照它们出现在标记或代码中的相同顺序进行评估。

在 ECMAScript 规范中，请参阅ModuleEvaluation方法，它遍历源文本模块记录的RequestedModules：

此记录表示的模块用于请求导入模块的所有 ModuleSpecifier 字符串的列表。该列表是源代码出现排序。

当使用带有 src 属性的脚本标签导入模块时，如果评估顺序不重要，则可以在下载后立即使用async属性执行它。

推荐阅读