import、require 、export、export default、exports、module exports

對比表

名稱	es6	node	說明	使用
export	√
export default	√
import	√			export/export default導出， import導入
exports		√
module.exports		√	exports = module.exports = {}
require	√	√		module.exports導出， require導入

export 與 export default

兩者關係

es6中使用

名稱	相同	不一樣
export	可導出常量、函數、文件、模塊等	1. 能夠有多個export 2.導入時要加{}
export default	可導出常量、函數、文件、模塊等	1.一個文件中只有一個export default 2.導入時不加{}

使用舉例

//export導出
//methods.js
export function methods(){ 
    console.log('123')
}
//export導入
import {methods} from './methods'


//export default導出
//methods.js
export default function methods(){ 
    console.log('456')
}
//export default導入
import methods from './methods'

exports 與 module.exports

兩者關係

node中使用
exports = module.exports = {}

瞭解更多，可參考文章：https://cnodejs.org/topic/523...

使用舉例

//module.exports導出
//en.js
module.exports = {
  login: {
    title: 'Login',
    btn: 'submit'
  }
}

//require導入
require(''./en)

import 與 require

• import 是 es6的語法
  import 與 export / export default 搭配，實現導入/導出
• require 是 es6 、node都有的語法
  require 與 module.exports 搭配，實現導入/導出

參考文章

https://segmentfault.com/a/11...
https://cnodejs.org/topic/523...