Почему декларации экспорта / импорта должны быть на верхнем уровне в es2015?

Question

Я начал использовать es2015 с babel в прошлом проекте. Когда я пытаюсь сделать import или же export внутри if состояние, у меня ошибка 'import' and 'export' may only appear at the top level, Я вижу много случаев для этого, и это хорошо работает с require, но не с модулями es2015. Есть ли причина для такого ограничения?

Answer 1

JavaScript выполняет статический анализ на модулях ES6. Это означает, что вы не можете динамически выполнять импорт или экспорт. Прочтите раздел 4.2 этой статьи для получения дополнительной информации:

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

Есть много причин для этого подхода, некоторые из которых заключаются в том, чтобы подготовить JavaScript для будущих функций, которые зависят от способности статического анализа исходного файла, а именно макросов и типов (обсуждаемых в вышеупомянутой статье).

В другой интересной статье на эту тему в качестве причин упоминаются циклические зависимости и быстрый поиск.

______

Если вы хотите выполнить export в некотором вложенном блоке модуля пересмотрите, как вы пишете модуль и выставляете его API / внутренние компоненты, поскольку это почти наверняка не является необходимым. То же самое касается, если вы в настоящее время requireмодули внутри вложенных блоков в вашем коде ES5. Почему бы и нет require / import в верхней части вашего модуля и использовать их API / внутренние компоненты во вложенных блоках? Основное преимущество этого подхода, по крайней мере с точки зрения читабельности, заключается в том, что вы можете знать зависимости модуля без необходимости сканировать его источник require звонки.