4.import命令

使用export命令定義了模塊的對外接口以后，其他 JS 文件就可以通過import命令加載這個模塊

上面代碼的import命令，用于加載profile.js文件，并從中輸入變量。import命令接受一對大括號，里面指定要從其他模塊導入的變量名。大括號里面的變量名，必須與被導入模塊（profile.js）對外接口的名稱相同

如果想為輸入的變量重新取一個名字，import命令要使用as關鍵字，將輸入的變量重命名

注意import命令具有提升效果，會提升到整個模塊的頭部首先執行

上面的代碼不會報錯，因為import的執行早于foo的調用。這種行為的本質是，import命令是編譯階段執行的，在代碼運行之前

由于import是靜態執行，所以不能使用表達式和變量，這些只有在運行時才能得到結果的語法結構

上面三種寫法都會報錯，因為它們用到了表達式、變量和if結構。在靜態分析階段，這些語法因為都沒有執行，所以是沒法得到值的

如果多次重復執行同一句import語句，那么只會執行一次，而不會執行多次

5.模塊的整體加載

除了指定加載某個輸出值，還可以使用整體加載，即用星號（*）指定一個對象，所有輸出值都加載在這個對象上面

現在，加載這個模塊

上面寫法是逐一指定要加載的方法，整體加載的寫法如下

6.export default 命令

從前面的例子可以看出，使用import命令的時候，用戶需要知道所要加載的變量名或函數名，才能按照export對應輸出的名稱去加載，否則無法加載。但是，用戶肯定希望快速上手，未必愿意閱讀文檔，去了解模塊有哪些屬性和方法

為了給用戶提供方便，讓他們不用閱讀文檔就能加載模塊，就要用到export default命令，為模塊指定默認輸出

其他模塊加載該模塊時，import命令可以為該匿名函數指定任意名字

上面代碼的import命令，可以用任意名稱指向export-default.js輸出的方法，這時就不需要知道原模塊輸出的函數名。需要注意的是，這時import命令后面，不使用大括號

export default命令用在非匿名函數前，也是可以的

注意：上面代碼的兩組寫法，第一組是使用export default時，對應的import語句不需要使用大括號；第二組是不使用export default時，對應的import語句需要使用大括號

export default命令用于指定模塊的默認輸出。顯然，一個模塊只能有一個默認輸出，因此export default命令只能使用一次。所以，import命令后面才不用加大括號，因為只可能對應一個方法

本質上，export default就是輸出一個叫做default的變量或方法，系統允許你為它取任意名字或者給他賦予任意的值

這里實際的意思就將add變量賦值給了default變量作為輸出

正是因為export default命令其實只是輸出一個叫做default的變量，所以它后面不能跟變量聲明語句

上面代碼中，export default a的含義是將變量a的值賦給變量default。所以，最后一種寫法會報錯

因為export default本質是將該命令后面的值，賦給default變量以后再輸出，所以直接將一個值寫在export default之后也是可以的

如果想在一條import語句中，同時輸入默認方法和其他變量，可以寫成下面這樣

總結

以上是生活随笔為你收集整理的ES6之Module的语法(2)的全部內容，希望文章能夠幫你解決所遇到的問題。

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