為什么要使用模塊化？
最主要的目的：
解決命名沖突
依賴管理其他價值：
提高代碼可讀性
代碼解耦，提高復用性
CMD、AMD、CommonJS 規范分別指什么？有哪些應用？
CommonJS 規范：
根據 CommomJS 規范，一個單獨的文件就是一個模塊。每一個模塊都是一個單獨的作用域，也就是說，在該模塊內部定義的變量，無法被其他模塊讀取，除非定義為global對象的屬性。這個規范同時定義了 module.exports 對象為模塊的出口，我們需要把想要輸出的內容放到 module.exports 對象中；定義了 require 方法為加載模塊的方式。這一規范主要應用在服務端的JS，即NodeJS上。例子如：
// 這里是a.js
var name = 'a';
// 輸出name
module.exports = {
name: name
}
// 這里是b.js
var a = require('a'); // 使用require方法加載模塊，并返回模塊內部的 module.exports 對象
a.name; // a
AMD 規范：
AMD 規范的意思是異步模塊定義的意思,它是一個在瀏覽器端模塊化開發的規范。由于不是JavaScript原生支持，使用AMD規范進行頁面開發需要用到對應的庫函數，也就是大名鼎鼎RequireJS，由 RequireJS 在推廣模塊化定義的過程中產出。 這個規范用于瀏覽器模塊化的開發，主要解決了兩個問題：
- 多個js文件可能有依賴關系，被依賴的文件需要早于依賴它的文件加載到瀏覽器
- 加載的時候瀏覽器會停止頁面渲染，加載文件越多，頁面失去響應時間越長
語法：
requireJS定義了一個函數 define，它是全局變量，用來定義模塊
define(id?, dependencies?, factory);
- id：可選參數，用來定義模塊的標識，如果沒有提供該參數，腳本文件名（去掉拓展名）
- dependencies：是一個當前模塊依賴的模塊名稱數組
- factory：工廠方法，模塊初始化要執行的函數或對象。如果為函數，它應該只被執行一次。如果是對象，此對象應該為模塊的輸出值
在頁面上使用require函數加載模塊
require([dependencies], function(){});
require()函數接受兩個參數
- 第一個參數是一個數組，表示所依賴的模塊
- 第二個參數是一個回調函數，當前面指定的模塊都加載成功后，它將被調用。加載的模塊會以參數形式傳入該函數，從而在回調函數內部就可以使用這些模塊
require()函數在加載依賴的函數的時候是異步加載的，這樣瀏覽器不會失去響應，它指定的回調函數，只有前面的模塊都加載成功后，才會運行，解決了依賴性的問題。
例子如：
// 這里是a.js
// define函數的第一個參數為依賴項數組，即想要加載的模塊：例如jquery
// 第二個參數為回調函數，等模塊加載完畢后會把加載的模塊傳到回調函數里
define(['jquery'], function ($) {
var name = 'a';
return {
name: name
} // 這里是模塊輸出，讓別的模塊能夠使用
});
// 這里是b.js
// 加載模塊a
// 等到所有模塊都加載完畢后再執行回調函數并把模塊傳到回調函數
require(['jquery', 'a'] function ($, a) {
a.name; // a
})
CMD 規范：
CMD 即Common Module Definition通用模塊定義，CMD規范是國內發展出來的，CMD 規范與 AMD 規范類似，就像AMD有個requireJS，CMD有個瀏覽器的實現SeaJS，SeaJS要解決的問題和requireJS一樣，只不過在模塊定義方式和模塊加載（可以說運行、解析）時機上有所不同但兩者的模塊加載時機和模塊定義的方式不同。使用這個規范的主要是 SeaJS。
語法
Sea.js 推崇一個模塊一個文件，遵循統一的寫法
define
define(id?, deps?, factory)
因為CMD推崇
- 一個文件一個模塊，所以經常就用文件名作為模塊id
- CMD推崇依賴就近，所以一般不在define的參數中寫依賴，在factory中寫
factory有三個參數
function(require, exports, module)
require 是 factory 函數的第一個參數
require(id)
require 是一個方法，接受 模塊標識 作為唯一參數，用來獲取其他模塊提供的接口
exports
exports 是一個對象，用來向外提供模塊接口
module
module 是一個對象，上面存儲了與當前模塊相關聯的一些屬性和方法
例子如：
// 這里是a.js
define(function (require, module, exports) {
var $ = require('jquery'); // 與AMD規范不同的是，CMD規范是要用到模塊的時候再加載，而AMD規范是先把所有模塊加載完后再用
$('div').addClass('active');
})
// 這里是b.js
// 使用模塊a
seajs.use(['a.js'], function(a){
// todo
});
AMD與CMD區別(關于這兩個的區別網上搜出一堆文章，簡單總結一下)
最明顯的區別就是在模塊定義時對依賴的處理不同
- AMD推崇依賴前置，在定義模塊的時候就要聲明其依賴的模塊
- CMD推崇就近依賴，只有在用到某個模塊的時候再去require
這種區別各有優劣，只是語法上的差距，而且requireJS和SeaJS都支持對方的寫法
AMD和CMD最大的區別是對依賴模塊的執行時機處理不同，注意不是加載的時機或者方式不同
同樣都是異步加載模塊，AMD在加載模塊完成后就會執行該模塊，所有模塊都加載執行完后會進入require的回調函數，執行主邏輯，這樣的效果就是依賴模塊的執行順序和書寫順序不一定一致，看網絡速度，哪個先下載下來，哪個先執行，但是主邏輯一定在所有依賴加載完成后才執行
CMD加載完某個依賴模塊后并不執行，只是下載而已，在所有依賴模塊加載完成后進入主邏輯，遇到require語句的時候才執行對應的模塊，這樣模塊的執行順序和書寫順序是完全一致的
這也是很多人說AMD用戶體驗好，因為沒有延遲，依賴模塊提前執行了，CMD性能好，因為只有用戶需要的時候才執行的原因
