模塊功能主要由兩個命令構成：export和import。export命令用于規定模塊的對外接口，import命令用于輸入其他模塊提供的功能。 #### export - 輸出的一組變量優先選用： `export { firstName, lastName, year };`，因為這樣就可以在腳本尾部，一眼看清楚輸出了哪些變量。 - 通常情況下，export輸出的變量就是本來的名字，但是可以使用as關鍵字重命名：`export { v1 as streamV1, v2 as streamV2, v2 as streamLatestVersion };` - export命令可以出現在模塊的任何位置，只要處于模塊頂層就可以；如果處于塊級作用域內，就會報錯，import命令也是如此；這是因為處于條件代碼塊之中，就沒法做靜態優化了，違背了ES6模塊的設計初衷。 #### import - import命令接受一對大括號，里面指定要從其他模塊導入的變量名。大括號里面的變量名，必須與被導入模塊（profile.js）對外接口的名稱相同。 - 如果想為輸入的變量重新取一個名字，import命令要使用as關鍵字，將輸入的變量重命名：`import { lastName as surname } from './test';` - import命令具有提升效果，會提升到整個模塊的頭部，首先執行,和變量提升類似 - 除了指定加載某個輸出值，還可以使用整體加載，即用星號（*）指定一個對象，所有輸出值都加載在這個對象上面；但是模塊整體加載所在的那個對象不允許運行時改變 ~~~ import * as circle from './circle'; console.log('圓面積：' + circle.area(4)); console.log('圓周長：' + circle.circumference(14)); ~~~ #### export default - 利用`export default` 為模塊指定默認輸出，其他模塊加載該模塊時，import命令可以為該匿名函數指定任意名字。 - 注意花括號的使用：使用export default時，對應的import語句**不需要使用大括號**；不使用export default時，對應的import語句需要**使用大括號**。 - export default命令用于指定模塊的默認輸出，顯然，一個模塊只能有一個默認輸出，因此export default命令只能使用一次，所以，import命令后面才不用加大括號，因為只可能對應一個方法。 - 正是因為export default命令其實只是輸出一個叫做default的變量，所以它后面不能跟變量聲明語句。 ~~~ // 正確 export var a = 1; // 正確 var a = 1; export default a; // 錯誤 export default var a = 1; ~~~ #### 最后 有一個提案，建議引入import()函數，完成動態加載。