1. 程式人生 > >es6語法: import 與export

es6語法: import 與export

1.export匯出的變數,Import必須知道變數名才可以匯入。

// 匯出有三種方法
export var num = 1;
//或
var num = 1;
export {num}
 
//export匯出的變數名 和Import 的變數名一樣。因此可以用as, 這樣import 時可以用alias接收。
export {
  num as alias
};

2.import 匯入

//如果是用export 匯出的話,那麼只能這樣匯入
import {變數名}

//如果是export default 匯出的話,不需要加大括號.

import 變數名

阮一峰說,import 具有宣告提升作用,就像下面這樣不會報錯;

foo();

import { foo } from 'my_module';

阮一峰又說:export default 是為了讀者不用閱讀原始碼裡面的匯出變數就知道 如何匯入.。

export 和export default區別:

1:export default 一個檔案只能有一個,export 可以有多個。

2:export 匯出的變數 import 必須用{ } 大括號來接收。

3:export 匯出的變數名是啥,import就要用啥接接收。export default 匯出的變數,import想用啥接收就用啥接收。

阮一峰說:因為export default

命令其實只是輸出一個叫做default的變數,所以它後面不能跟變數宣告語句。

下面程式碼中,export default a的含義是將變數a的值賦給變數default。所以,最後一種寫法會報錯。

同樣地,因為export default命令的本質是將後面的值,賦給default變數,所以可以直接將一個值寫在export default之後。

//引用阮一峰的code
// 正確
export var a = 1;

// 正確
var a = 1;
export default a;

// 錯誤
export default var a = 1;

// 正確 對外暴露的介面就是default
export default 42;

// 報錯 沒有對外暴露介面
export 42;