Блог

Если у меня есть следующее:

 <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>
 

2. Прав ли я, говоря, что могу быть уверен, что three.js это будет выполнено ПОСЛЕ one.js и two.js ? (это важно)

Комментарий о возможных дубликатах

Я знаю, что это выглядит как дублирующий вопрос, но, пожалуйста, имейте в виду, что цель этого вопроса-подтвердить совершенно другое поведение импорта с помощью HTML и JavaScript

Прав ли я, говоря, что вы не можете быть на 100% уверены в том, что three.js будет выполнено ПОСЛЕ one.js и two.js?

Да, потому что, например three.js возможно, они уже были ввезены в one.js, и модули оцениваются только один раз.

Прав ли я, говоря, что могу быть уверен в том, что three.js будет выполнено ПОСЛЕ one.js и two.js? (это важно)

Нет, по той же причине, что и выше.

При обоих способах импорта модуля, если ни один из модулей не был импортирован ранее, они будут оцениваться в том же порядке, в каком они отображаются в разметке или коде.

В спецификации ECMAScript см. Метод оценки модуля, который выполняет итерацию по запрошенным модулям записи модуля исходного текста:

Список всех строк-спецификаторов модулей, используемых модулем, представленным этой записью, для запроса импорта модуля. Список является упорядоченным вхождением исходного кода.

При импорте модуля с использованием тега сценария с атрибутом src, если порядок оценки не важен, атрибут async можно использовать для его выполнения сразу после загрузки.

Нет, это не гарантирует, что он будет работать в том же порядке. Это зависит от всех других файлов и импорта.

Модули Es6 оцениваются только один раз. Это означает, что инструкция import не означает оценку. Когда выполняется первый хост-модуль (модуль, который импортирует Òne.js или Two.js ), затем оцениваются импортированные модули. И тот же экземпляр будет предоставлен для дальнейшего импорта.

Скажем A.js , импортирует Two.js и сначала выполняется, а B.js затем запускается и B.js импортирует оба One.js и Two.js (предполагая, что только эти два файла импортируют эти модули). затем со временем B.js выполняется Two.js уже оцененная, но One.js должна быть оценена сейчас.

https://262.ecma-international.org/6.0/#sec-hostresolveimportedmodule

В общем случае, если все модули не имеют взаимного импорта, в обоих случаях модули выполняются в одних и тех же заказах.

В первом случае тип module работает как defer скрипт. Код выполняется в правильном порядке после загрузки DOM. Об этом говорится в документации defer https://developer.mozilla.org/en-US/docs/Web/HTML/Element/script#attr-defer (желтая клетка и следующий абзац).

Во втором случае импорт, как вы и ожидали, выполняется в порядке, определенном в файле.