1、<script>標簽打開defer或async屬性，腳本就會異步加載。渲染引擎遇到這一行命令，就會開始下載外部腳本，但不會等它下載和執(zhí)行，而是直接執(zhí)行后面的命令。

defer與async的區(qū)別是：前者要等到整個頁面正常渲染結束，才會執(zhí)行；后者一旦下載完，渲染引擎就會中斷渲染，執(zhí)行這個腳本以后，再繼續(xù)渲染。一句話，defer是“渲染完再執(zhí)行”，async是“下載完就執(zhí)行”。另外，如果有多個defer腳本，會按照它們在頁面出現(xiàn)的順序加載，而多個async腳本是不能保證加載順序的。

2、瀏覽器加載 ES6 模塊，也使用<script>標簽，但是要加入type="module"屬性。

瀏覽器對于帶有type="module"的<script>，都是異步加載，不會造成堵塞瀏覽器，即等到整個頁面渲染完，再執(zhí)行模塊腳本，等同于打開了<script>標簽的defer屬性。

3、對于外部的模塊腳本，有幾點需要注意。

• 代碼是在模塊作用域之中運行，而不是在全局作用域運行。模塊內部的頂層變量，外部不可見。
• 模塊腳本自動采用嚴格模式，不管有沒有聲明use strict。
• 模塊之中，可以使用import命令加載其他模塊（.js后綴不可省略，需要提供絕對 URL 或相對 URL），也可以使用export命令輸出對外接口。
• 模塊之中，頂層的this關鍵字返回undefined，而不是指向window。也就是說，在模塊頂層使用this關鍵字，是無意義的。
• 同一個模塊如果加載多次，將只執(zhí)行一次。

4、利用頂層的this等于undefined這個語法點，可以偵測當前代碼是否在 ES6 模塊之中。

5、討論 Node 加載 ES6 模塊之前，必須了解 ES6 模塊與 CommonJS 模塊完全不同。

它們有兩個重大差異。

• CommonJS 模塊輸出的是一個值的拷貝，ES6 模塊輸出的是值的引用。
• CommonJS 模塊是運行時加載，ES6 模塊是編譯時輸出接口。

6、在靜態(tài)分析階段，一個模塊腳本只要有一行import或export語句，Node 就會認為該腳本為 ES6 模塊，否則就為 CommonJS 模塊。如果不輸出任何接口，但是希望被 Node 認為是 ES6 模塊，可以在腳本中加一行語句export {};。

7、ES6 模塊之中，頂層的this指向undefined；CommonJS 模塊的頂層this指向當前模塊，這是兩者的一個重大差異。

8、Node 采用 CommonJS 模塊格式，模塊的輸出都定義在module.exports這個屬性上面。在 Node 環(huán)境中，使用import命令加載 CommonJS 模塊，Node 會自動將module.exports屬性，當作模塊的默認輸出，即等同于export default。?

轉載于:https://www.cnblogs.com/zczhangcui/p/6574877.html

總結

以上是生活随笔為你收集整理的js-ES6学习笔记-module（4）的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。