Nic Lin's Blog

喜歡在地上滾的工程師

ES6: export default 和 export 的差別

歷史上,JavaScript 沒有 module 的體系,無法將一個大程序拆分成互相依賴的小模組在用更簡單的方式拼湊起來。

  • ruby 有 require
  • python 有 import
  • CSS 有 @import

在一個檔案內 export default 只能有一個,而 export 可以有多個

如果只透過 export 時,在 import 必須加入花刮號 {} 來導入

兩者都可以導入常量、函數、檔案、模組

  • export 對應的 import 需要知道 export 拋出的變量名或函數名
  • export default 對應的 import 則不需要知道

export

// app.js

export const str = "hello world";
export function log(sth) { 
  return sth;
}

對應的導入方式

import { str, log } from 'app'

export default

// app.js

const str = "hello world";
export default str;

對應的導入方式

import str from 'app';
comments powered by Disqus