es6模組的匯入和執行順序
第一部分開始
<script src="module.js" type="module"></script> //這個先執行
<script type="module">
console.log('inner module');
import {con} from "./inlinefirst.js";
con();
</script>
第二部分開始
<script src="module.js" type="module" async></script>
<script type="module">//這個先執行
console.log('inner module');
import {con} from "./inlinefirst.js";
con();
</script>
第三部分開始
<script src="module.js" type="module"></script>//執行順序不定，有可能先，有可能後
<script type="module" async>
console.log('inner module');
import {con} from "./inlinefirst.js";
con();
</script>
其中module.js的程式碼為
console.log('module');
import {con} from "./first.js";
con();
import {con2} from "./second.js";
con2();
其中first.js的程式碼為
console.log('first called');
export function con() {
console.log('first');
}
second.js的程式碼和first.js的類似
module.js執行輸出為下圖
由此可以看出，import在執行的時候有類似function的提升效果
有個好部落格：https://jakearchibald.com/2017/es-modules-in-browsers/