1.CommonJS java
根據CommonJS規範,一個單獨的文件就是一個模塊。加載模塊使用require方法,該方法讀取一個文件並執行,最後返回文件內部的exports對象。因此,定義一個模塊就是寫一個新的js文件,可是最後要將文件的內容exports出來。接下來咱們看一下如何定義模塊和加載模塊。node
//module1.js exports.foo = function () { console.log('this is module1 foo'); } //main.js let module1 = require('./module1'); module1.foo();
如上代碼,定義module1模塊文件 在主入口引入 並調用方法,exports也能夠換成module.exports 二者關係是前者引用後者,最終導出的函數 變量等等都是以module.exports爲準,固然 exports=2這種修改是不起做用的。git
nodejs 用的就是CommonJS規範.github
2.AMD後端
AMD是"Asynchronous Module Definition"的縮寫,意思就是"異步模塊定義"。它採用異步方式加載模塊,模塊的加載不影響它後面語句的運行。全部依賴這個模塊的語句,都定義在一個回調函數中,等到加載完成以後,這個回調函數纔會運行。api
AMD也採用require()語句加載模塊,可是不一樣於CommonJS,它要求兩個參數:數組
require([module], callback);
第一個參數[module],是一個數組,裏面的成員就是要加載的模塊;第二個參數callback,則是加載成功以後的回調函數。若是將前面的代碼改寫成AMD形式,就是下面這樣:瀏覽器
require(['math'], function (math) {
math.add(2, 3); });
看到這段代碼就想起了angularJS,好像是angular1的時候有相似這樣的代碼。服務器
3.CMD異步
CMD 是seajs
推崇的規範,CMD
則是依賴就近,用的時候再require
。它寫起來是這樣的:
define(function(require, exports, module) { var clock = require('clock'); clock.start(); });
這裏具體到使用的時候再來決定加載哪些文件,AMD CMD都是異步加載.
總結:CommonJs主要針對服務端,AMD/CMD主要針對瀏覽器端,因此最容易混淆的是AMD/CMD。(順便提一下,針對服務器端和針對瀏覽器端有什麼本質的區別呢?服務器端通常採用同步加載文件,也就是說須要某個模塊,服務器端便停下來,等待它加載再執行。這裏若是有其餘後端語言,如java,經驗的‘玩家’應該更容易理解。而瀏覽器端要保證效率,須要採用異步加載,這就須要一個預處理,提早將所須要的模塊文件並行加載好。)
AMD
和CMD
最大的區別是對依賴模塊的執行時機處理不一樣,而不是加載的時機或者方式不一樣,兩者皆爲異步加載模塊。AMD
依賴前置,js
能夠方便知道依賴模塊是誰,當即加載;而CMD
就近依賴,須要使用把模塊變爲字符串解析一遍才知道依賴了那些模塊