javascript - es6模組載入export的輸出值有點沒太搞清楚

Question

這樣為什麼會報錯誤呢

為什麼這樣就可以？那個大括號的作用是什麼 是文法就這樣嗎

Answer 1

在es6標準沒出來之前，export啥，require就是啥。

以nodejs為例

// ./fk.js
export 'fk';

// ./main.js
var fk = require('./fk');
console.log(fk); // output "fk"

你看，這一點都不“模組化”，既然是模組導入進來就應該要有數值，有函數，有車有驢有火鍋才行嘛。

那怎麼辦呢？
標註規定，導出的所有內容必須都有“名字”，你起個別名也可以，反正要有名字！

第一種取名字的方法

export var/let/const 名字=值

第二種取名字的方法

var/let/const 变量=值
export {变量} 或 export {变量 as 别名}

第三種取名字的方法

export default 值

第一張圖裡的第二個方法之所以報錯，是因為你不用大括號括起來，在編譯的時候m早就不知道叫什麼了，不知道叫什麼就沒有名字，起不了名字就不能導出。

完。

Answer 2

看文檔 export on MDN

一共就這麼多種形式

export { name1, name2, …, nameN };
export { variable1 as name1, variable2 as name2, …, nameN };
export let name1, name2, …, nameN; // also var
export let name1 = …, name2 = …, …, nameN; // also var, const

export default expression;
export default function (…) { … } // also class, function*
export default function name1(…) { … } // also class, function*
export { name1 as default, … };

export * from …;
export { name1, name2, …, nameN } from …;
export { import1 as name1, import2 as name2, …, nameN } from …;

你寫的兩種形式都不包含在內……具體每種形式是什麼意思，還是看文檔去吧！

Answer 3

https://developer.mozilla.org...

這種問題直接閱讀文件就行了。而且你這個圖不是從阮一峰的文章裡扒過來的？原文有清晰的說明

需要特別注意的是，export指令規定的是對外的接口，必須與模組內部的變數建立一一對應關係。

上面兩種寫法都會報錯，因為沒有提供對外的介面。第一種寫法直接輸出1，第二種寫法透過變數m，還是直接輸出1。1只是一個值，不是介面。