是否提升了ES6模块的进口？

Question

我知道在新的ES6模块语法中,JavaScript引擎不必评估代码以了解所有导入/导出,它只会解析它并"知道"要加载的内容.

这听起来像是在吊装.ES6模块是否悬挂？如果是这样,它们会在运行代码之前加载吗？

这段代码可以吗？

import myFunc1 from 'externalModule1';

myFunc2();

if (Math.random()>0.5) {
    import myFunc2 from 'externalModule2';
}

Answer 1

它将是一个SyntaxError.根据规范的这一部分:

Module :
   ModuleBody

ModuleBody :
    ModuleItemList

ModuleItemList :
    ModuleItem
    ModuleItemList ModuleItem

ModuleItem :
    ImportDeclaration
    ExportDeclaration
    StatementListItem

这意味着模块只能包含ImportDeclaration's ExportDeclaration'或StatementListItem's'.根据这个 StatementListItem不能包含ImportDeclaration也没有ExportDeclaration.

import myFunc1 from 'externalModule1'; 

是进口申报,而:

if (Math.random()>0.5) {
    import myFunc2 from 'externalModule2';
}

是一份声明.所以你的代码会导致语法错误.

那么"在运行代码之前它们都会被加载吗？".规范的这一部分包含下一句:

注意:在实例化模块之前,它所请求的所有模块都必须可用.

是的.在运行代码之前,它们都将被加载.

Answer 2

在做了一些研究后,我发现:

• 进口量悬挂!根据规范的ModuleDeclarationInstantiation
• 在运行任何代码之前,将加载所有相关模块.

此代码没有错误,并且将起作用:

localFunc();

import {myFunc1} from 'mymodule';

function localFunc() { // localFunc is hoisted
    myFunc1();
}