淺析JS中的模塊規範（CommonJS，AMD，CMD） http://www.2cto.com/kf/201411/348276.html
阿新 • • 發佈：2017-05-21
cpu 重要 mat 只有一個 targe () actor cti 最重要的
如果你聽過js模塊化這個東西，那麽你就應該聽過或CommonJS或AMD甚至是CMD這些規範咯，我也聽過，但之前也真的是聽聽而已。
現在就看看吧，這些規範到底是啥東西，幹嘛的。 一、CommonJS CommonJS就是為JS的表現來制定規範，因為js沒有模塊的功能所以CommonJS應運而生，它希望js可以在任何地方運行，不只是瀏覽器中。 CommonJS能有一定的影響力，我覺得絕對離不開Node的人氣，不過喔，Node，CommonJS，瀏覽器甚至是W3C之間有什麽關系呢，我找到了個貼切的圖： |---------------瀏覽器----- ------------------| |--------------------------CommonJS----------------------------------| | BOM | | DOM | | ECMAScript | | FS | | TCP | | Stream | | Buffer | |........| |-------W3C-----------| |---------------------------------------Node--------------------------------------------------| CommonJS定義的模塊分為:{模塊引用(require)} {模塊定義(exports)} {模塊標識(module)} require()用來引入外部模塊；exports對象用於導出當前模塊的方法或變量，唯一的導出口；module對象就代表模塊本身。 比如說我們就可以這樣用了： 復制代碼 1 //sum.js 2 exports.sum = function(){...做加操作..}; 3 4 //calculate.js 5 var math = require(‘sum‘); 6 exports.add = function(n){ 7 return math.sum(val,n); 8 }; 復制代碼 雖說Node遵循CommonJS的規範，但是相比也是做了一些取舍，填了一些新東西的。 不過，說了CommonJS也說了Node，那麽我覺得也得先了解下NPM了。NPM作為Node的包管理器，不是為了幫助Node解決依賴包的安裝問題嘛，那它肯定也要遵循CommonJS規範啦，它遵循包規範（還是理論）的。 CommonJS WIKI講了它的歷史，還介紹了modules和packages等。 二、AMD CommonJS是主要為了JS在後端的表現制定的，他是不適合前端的，為什麽這麽說呢？ 這需要分析一下瀏覽器端的js和服務器端js都主要做了哪些事，有什麽不同了： ---------------------------------------服務器端JS | 瀏覽器端JS------------------------------------------- 相同的代碼需要多次執行 | 代碼需要從一個服務器端分發到多個客戶端執行 CPU和內存資源是瓶頸 | 帶寬是瓶頸 加載時從磁盤中加載 | 加載時需要通過網絡加載 --------------------------------------------------------------------------------------------------------------- 於是乎，AMD(異步模塊定義)出現了，它就主要為前端JS的表現制定規範。 AMD就只有一個接口：define(id?,dependencies?,factory); 它要在聲明模塊的時候制定所有的依賴(dep)，並且還要當做形參傳到factory中，像這樣： 1 define([‘dep1‘,‘dep2‘],function(dep1,dep2){...}); 要是沒什麽依賴，就定義簡單的模塊，下面這樣就可以啦： 1 define(function(){ 2 var exports = {}; 3 exports.method = function(){...}; 4 return exports; 5 }); 咦，這裏有define，把東西包裝起來啦，那Node實現中怎麽沒看到有define關鍵字呢，它也要把東西包裝起來呀，其實吧，只是Node隱式包裝了而已..... RequireJS就是實現了AMD規範的呢。 這有AMD的WIKI中文版，講了很多蠻詳細的東西，用到的時候可以查看：AMD的WIKI中文版 三、CMD 大名遠揚的玉伯寫了seajs，就是遵循他提出的CMD規範，與AMD蠻相近的，不過用起來感覺更加方便些，最重要的是中文版，應有盡有：seajs官方doc 1 define(function(require,exports,module){...}); 用過seajs吧，這個不陌生吧，對吧。淺析JS中的模塊規範（CommonJS，AMD，CMD） http://www.2cto.com/kf/201411/348276.html