ES6和nodejs流行之后兽赁，經(jīng)常會(huì)使用export屿良，import，module.exports一類模塊導(dǎo)入導(dǎo)出的語(yǔ)法痘昌，其實(shí)對(duì)于他們的實(shí)際使用場(chǎng)景和區(qū)別我是很暈的，踩了坑才發(fā)現(xiàn)需要區(qū)別它們的使用炬转。
模塊
模塊思想的出現(xiàn)致使我們闊以方便的引入導(dǎo)出代碼辆苔，將一些可復(fù)用的功能封裝導(dǎo)出或引入。所以闊以分享代碼以及實(shí)現(xiàn)復(fù)用性的組件扼劈。
規(guī)范
JS的模塊規(guī)范有CommonJS和AMD兩種驻啤。
CommonJS 用于服務(wù)端，即 nodeJs 加載模塊的方式荐吵。每個(gè)文件就是一個(gè)模塊骑冗，有自己的作用域。在一個(gè)文件里面定義的變量先煎、函數(shù)贼涩、類，都是私有的薯蝎，對(duì)其他文件不可見(jiàn)遥倦。模塊之間通過(guò) require 進(jìn)行加載。
AMD 加載方式用于瀏覽器環(huán)境中占锯，因?yàn)闉g覽器從網(wǎng)絡(luò)加載 JS 有延遲袒哥，無(wú)法像 nodeJs 服務(wù)器環(huán)境一樣直接讀文件缩筛。所以使用 define('moduleName',['dependences'], function(){}) 這種方式定義模塊。
ES6 在語(yǔ)言標(biāo)準(zhǔn)的層面上统诺，實(shí)現(xiàn)了模塊功能歪脏，而且實(shí)現(xiàn)得相當(dāng)簡(jiǎn)單，完全可以取代 CommonJS 和 AMD 規(guī)范粮呢，成為瀏覽器和服務(wù)器通用的模塊解決方案婿失。
服務(wù)器端Nodejs
導(dǎo)入：require
導(dǎo)出：module.exports或exports
瀏覽器端
導(dǎo)入：import或require
導(dǎo)出：export或export default
對(duì)比module.exports與exports
module變量代表當(dāng)前模塊。這個(gè)變量是一個(gè)對(duì)象啄寡，它的exports屬性（即module.exports）是對(duì)外的接口豪硅。加載某個(gè)模塊，其實(shí)是加載該模塊的module.exports屬性挺物。
而exports變量是指向module.exports的懒浮，所以闊以直接在 exports 對(duì)象上添加方法，表示對(duì)外輸出接口识藤。等同于在 module.exports 上添加方法砚著。
function add (flag) {
return flag + 1
}
module.exports.x = 1
exports.add = add
對(duì)比export與export default
export方法導(dǎo)出一組方法或變量
export default方法導(dǎo)出一個(gè)方法或變量
例如：
// export方法
export const a = 1
export const b = () => {
console.log('func')
}
//export default方法
const c = {
a: '1',
b: function () {}
}
export default c
使用這兩種方式導(dǎo)出的模塊在導(dǎo)入也有區(qū)別
// 對(duì)于export方法導(dǎo)出的模塊
import { a } from './xxx'
// 對(duì)于export default方法導(dǎo)出的模塊
import c from './xxx'
http://www.reibang.com/p/076f2af97db0
其次，一些語(yǔ)法的書(shū)寫(xiě)闊以瀏覽http://www.infoq.com/cn/articles/es6-in-depth-modules
