commonJS、AMD和CMD之間的區別

JS中的模塊規範(CommonJS,AMD,CMD),若是你聽過js模塊化這個東西,那麼你就應該聽過或CommonJS或AMD甚至是CMD這些規範咯,我也聽過,但以前也真的是聽聽而已。 如今就看看吧,這些規範究竟是啥東西,幹嗎的。前端

 

1、CommonJSwebpack

 CommonJS就是爲JS的表現來制定規範,NodeJS是這種規範的實現,webpack 也是以CommonJS的形式來書寫。由於js沒有模塊的功能因此CommonJS應運而生,它但願js能夠在任何地方運行,不僅是 瀏覽器中。它的終極目標是提供一個相似Python,Ruby和Java標準庫。

CommonJS定義的模塊分爲:{模塊引用(require)} {模塊定義(exports)} {模塊標識(module)}git

require()用來引入外部模塊;exports對象用於導出當前模塊的方法或變量,惟一的導出口;module對象就表明模塊自己。github

雖然說Node遵循CommonJS的規範,可是相比也是作了一些取捨,填了一些新東西的。web

不過,說了CommonJS也說了Node,那麼我以爲也得先了解下NPM了。NPM做爲Node的包管理器,不是爲了幫助Node解決依賴包的安裝問題嘛,那它確定也要遵循CommonJS規範啦,它遵循包規範(仍是理論)的。後端

CommonJS WIKI講了它的歷史,還介紹了modules和packages等。api

2、AMD瀏覽器

CommonJS是主要爲了JS在後端的表現制定的,他是不適合前端的,爲何這麼說呢?服務器

這須要分析一下瀏覽器端的js和服務器端js都主要作了哪些事,有什麼不一樣了:異步

因而乎,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中文版

3、CMD

大名遠揚的玉伯寫了seajs,就是遵循他提出的CMD規範,與AMD蠻相近的,不過用起來感受更加方便些,最重要的是中文版,應有盡有:seajs官方doc

1 define(function(require,exports,module){...});

用過seajs吧,這個不陌生吧,對吧。

前面說AMD,說RequireJS實現了AMD,CMD看起來與AMD好像呀,那RequireJS與SeaJS像不像呢?

雖然CMD與AMD蠻像的,但區別仍是挺明顯的,官方非官方都有闡述和理解,我以爲吧,說的都挺好:

官方闡述SeaJS與RequireJS異同

SeaJS與RequireJS的最大異同(這個說的也挺好)

相關文章
相關標籤/搜索