1. 程式人生 > >CommonJS, AMD ,CMD和 RequireJS之間的關係

CommonJS, AMD ,CMD和 RequireJS之間的關係

先說說CommonJS CommonJS - 大家是不是覺得JavaScript僅僅是一個客戶端的編譯語言,其實JavaScript設計之初不僅僅是針對客戶端設計的語言。後來只是由於Web的迅速流行,加之Netscape和微軟之間之爭過早的將JavaScipt標準化。要了解詳細的JS歷史請檢視:http://zh.wikipedia.org/zh-cn/JavaScript。過早的標準化JS就導致JS的諸多缺陷和標準類庫的缺乏,即使這樣也不影響JS成為一門優秀的程式設計語言(比如現在非常流行的Node.js)。目前JS僅僅包括基本的API,如果要作為一個server端的程式語言,像IO, FS, i18n, package等等特性都沒有,
CommonJS是一個組織,它讓JS可以在共同的方向上做努力,來完善JS。儘量Common JS現在還沒有一個正式版釋出,但是很多方向的草案的實現都已經取得很好的成果。例如現在非常流行的Node.js。 再回到本文的主題來,CommonJS和AMD,RequireJS有什麼關係呢?原來CommonJS其中就有一個Modules規範,我們都像JS現在這樣所有東西都寫在一個檔案中來寫server端應用是一件非常困難的事情,它就是來解決JS沒有模組化管理程式碼的功能。關鍵部分就二個函式:require - 用來引入依賴export - 用來匯出模組,包括識別符號(identifier)和模組內容(contents)CommonJS並沒有只是一個規範,就像Java中的Interface一樣,並沒有註明你應該怎麼實現。問題在於CommonJS的這個Modules規範設計之初是為了server端設計的,它是一個同步的模式。但是這種模式並不適合於
瀏覽器
端,大家設想一下如果瀏覽器同步模式一個一個載入模組,那麼開啟將會變得非常的慢,所以AMD就是為了這個誕生,它最大的特點就是可以非同步的方式載入模組,具體的不同在於AMD有一個define函式,它可以讓當前模組執行時先載入當前模組所依賴的模組,例如以下定義的意義就是在執行function時先載入依賴的module, dependency, array模組。define('module/id/string', ['module', 'dependency', 'array'], function(module, dependency, array) {  return ModuleContents;  });所以說CommonJS Module和AMD都是JS模組化定義的API,出自相同的起源的,就是可以讓JS可以模組化載入。那麼
RequrieJS其實就是AMD現在用的最廣泛,最流行的實現。在RequireJS網站上的介紹其實也有說明RequireJS誕生的原因,只是當時我並沒有看懂。RequireJS is a JavaScript file and module loader. It is optimized for in-browser use, but it can be used in other JavaScript environments, like Rhino and Node. Using a modular script loader like RequireJS will improve the speed and quality of your code.從以上基本可以看清CommonJS(泛指Modules規範),AMD和RequireJS之前的關係了。簡單的來講CommonJS Modules和AMD都是為了解決JS模組化的規範API,CommonJS更適合於Server端,而AMD基本是用於瀏覽器端(不過它也可以用於Server端,比如Node loader的方向的努力:http://requirejs.org/docs/node.html),而RequireJS就是AMD最流行的實現。

CMD是國內玉伯大神在開發SeaJS的時候提出來的,屬於CommonJS的一種規範,此外還有AMD,其對於的框架是RequireJS
1、二者都是非同步模組定義(Asynchronuous Module Definition)的一個實現;
2、CMD和AMD都是CommonJS的一種規範的實現定義,RequireJS和SeaJS是對應的實踐;
3、CMD和AMD的區別:CMD相當於按需載入,定義一個模組的時候不需要立即制定依賴模組,在需要的時候require就可以了,比較方便;而AMD則相反,定義模組的時候需要制定依賴模組,並以形參的方式引入factory中。
區別看下邊例子:

//AMD方式定義模組

define(['dep1','dep2'],function(dep1,dep2){

     //內部只能使用制定的模組

      return function(){};

});

//CMD

define(function(require,exports,module){

   //此處如果需要某XX模組,可以引入

   var xx=require('XX');

});

4、JavaScript語言是弱結構性的,通過CommonJS定義一些規範,CMD和AMD得定義模組的方式對程式碼進行管理,使得更易維護;此外,NodeJS的誕生,對模組的規範定義,和包(npm)的概念的引入,讓JS管理不再困難,一個字,爽爆了!