<script>標(biāo)簽
<script src="module1.js"></script>
<script src="module2.js"></script>
<script src="libraryA.js"></script>
<script src="module3.js"></script>
????這是最原始的 JavaScript 文件加載方式竹挡，如果把每一個(gè)文件看做是一個(gè)模塊，那么他們的接口通常是暴露在全局作用域下，也就是定義在 window對(duì)象中，不同模塊的接口調(diào)用都是一個(gè)作用域中，一些復(fù)雜的框架录语，會(huì)使用命名空間的概念來(lái)組織這些模塊的接口，典型的例子如 YUI 庫(kù)禾乘。
這種原始的加載方式暴露了一些顯而易見(jiàn)的弊端：
????全局作用域下容易造成變量沖突澎埠；
????文件只能按照 <script>的書(shū)寫(xiě)順序進(jìn)行加載；
????開(kāi)發(fā)人員必須主觀解決模塊和代碼庫(kù)的依賴關(guān)系始藕；
????在大型項(xiàng)目中各種資源難以管理蒲稳，長(zhǎng)期積累的問(wèn)題導(dǎo)致代碼庫(kù)混亂不堪。
CommonJS
????服務(wù)器端的 Node.js 遵循 CommonJS規(guī)范伍派，該規(guī)范的核心思想是允許模塊通過(guò) require
方法來(lái)同步加載所要依賴的其他模塊江耀，然后通過(guò) exports或 module.exports來(lái)導(dǎo)出需要暴露的接口。
require("module");require("../file.js");exports.doStuff = function() {};module.exports = someValue;
優(yōu)點(diǎn)：
????服務(wù)器端模塊便于重用NPM 中已經(jīng)有將近20萬(wàn)個(gè)可以使用模塊包簡(jiǎn)單并容易使用
缺點(diǎn)：
????同步的模塊加載方式不適合在瀏覽器環(huán)境中诉植，同步意味著阻塞加載祥国，瀏覽器資源是異步加載的不能非阻塞的并行加載多個(gè)模塊
實(shí)現(xiàn)：
服務(wù)器端的 Node.js
Browserify，瀏覽器端的 CommonJS 實(shí)現(xiàn)晾腔，可以使用 NPM 的模塊舌稀，但是編譯打包后的文件體積可能很大
modules-webmake，類(lèi)似Browserify建车，還不如 Browserify 靈活
wreq扩借，Browserify 的前身
AMD
????Asynchronous Module Definition 規(guī)范其實(shí)只有一個(gè)主要接口 define(id?, dependencies?, factory)椒惨，它要在聲明模塊的時(shí)候指定所有的依賴 dependencies缤至，并且還要當(dāng)做形參傳到 factory中，對(duì)于依賴的模塊提前執(zhí)行，依賴前置领斥。
define("module", ["dep1", "dep2"], function(d1, d2) `{ return someExportedValue;});require(["module", "../file"], function(module, file) { /* ... */ });`
優(yōu)點(diǎn)：
適合在瀏覽器環(huán)境中異步加載模塊
可以并行加載多個(gè)模塊
缺點(diǎn)：
提高了開(kāi)發(fā)成本嫉到，代碼的閱讀和書(shū)寫(xiě)比較困難，模塊定義方式的語(yǔ)義不順暢
不符合通用的模塊化思維方式月洛，是一種妥協(xié)的實(shí)現(xiàn)
CMD
Common Module Definition 規(guī)范和 AMD 很相似何恶，盡量保持簡(jiǎn)單，并與 CommonJS 和 Node.js 的 Modules 規(guī)范保持了很大的兼容性嚼黔。
define(function(require, exports, module) { var $ = require('jquery'); var Spinning = require('./spinning'); exports.doSomething = ... module.exports = ...})
優(yōu)點(diǎn)：
依賴就近细层，延遲執(zhí)行
可以很容易在 Node.js 中運(yùn)行
缺點(diǎn)：
依賴 SPM 打包，模塊的加載邏輯偏重
UMD
Universal Module Definition 規(guī)范類(lèi)似于兼容 CommonJS 和 AMD 的語(yǔ)法糖唬涧，是模塊定義的跨平臺(tái)解決方案疫赎。
ES6 模塊
EcmaScript6 標(biāo)準(zhǔn)增加了 JavaScript 語(yǔ)言層面的模塊體系定義。ES6 模塊的設(shè)計(jì)思想碎节，是盡量的靜態(tài)化捧搞，使得編譯時(shí)就能確定模塊的依賴關(guān)系，以及輸入和輸出的變量狮荔。CommonJS 和 AMD 模塊胎撇，都只能在運(yùn)行時(shí)確定這些東西。
import "jquery";export function doStuff() {}module "localModule" {}
優(yōu)點(diǎn)：
容易進(jìn)行靜態(tài)分析
面向未來(lái)的 EcmaScript 標(biāo)準(zhǔn)
缺點(diǎn)：
原生瀏覽器端還沒(méi)有實(shí)現(xiàn)該標(biāo)準(zhǔn)
全新的命令字殖氏，新版的 Node.js才支持
