JavaScript 自學筆記38

1. 使用import() 來動態導入模塊

ES2020引入了import()來實現動態導入模塊的功能。

在ES2020之前，模塊的導入與導出必須是靜態的。

(1). 語法

• import('需要使用的module.js文件的路徑')；
• import() 返回的是一個promise。一旦模塊被完全加載，promise就會被執行。

如：if (需要滿足的條件) {

   import('module.js').then( (module) => {

        module.function();

} );

}

(2). 花式搭配

• 可以用async / await 來處理import()的結果。

如：btn.addEventListener( 'click', function () {

        ( async () => {

                try {

                        let example = await import('example.js');

                        example.greeting();

                } catch (e) {

                        console.log(e);

                }