javascript
理解AMD ，CMD，CommonJS规范
https://blog.csdn.net/xcymorningsun/article/details/52709608
?
理解AMD ，CMD，CommonJS規范
2016年09月30日 10:33:00?gis_morningsun?閱讀數 10724這是一篇關于javascript模塊化AMD,CMD,CommonJS的學習總結，作為記錄也給同樣對三種方式有疑問的童鞋們，有不對或者偏差之處，望各位大神指出，不勝感激。
本篇默認讀者大概知道require，seajs的用法(AMD,CMD用法)，所以沒有加入使用語法。
?
?
1、為何而生：
?這三個規范都是為javascript模塊化加載而生的，都是在用到或者預計要用到某些模塊時候加載該模塊，使得大量的系統巨大的龐雜的代碼得以很好的組織和管理。模塊化使得我們在使用和管理代碼的時候不那么混亂，而且也方便了多人的合作。
?
2、那些規范們：
? ? ? （1)、CommonJS?是一個有志于構建 JavaScript 生態圈的組織。整個社區致力于提高 JavaScript 程序的可移植性和可交換性，無論是在服務端還是瀏覽器端。
?a groupwith a goal of building up the JavaScript ecosystem for web servers, desktopand command line apps and in the browser.
一個有目標的構建JavaScript生態系統Web服務器組，在瀏覽器和命令行應用程序和桌面。（他自己wiki上這么說的）
? ? ? ? ? ?這個組織呢制定了一些規范 （可以去他們網站看看?http://www.commonjs.org/）包括CommonJS Modules/1.0 規范，我們平時所說的commonjs規范，說的就是這個了。
? ? ? ? ??“TheCommonJS API will fill that gap by defining APIs that handle many commonapplication needs, ultimately providing a standard library as rich as those ofPython, Ruby and Java.?”--（出自?http://www.commonjs.org/）
所以說Commonjs是一個更偏向于服務器端的規范。Node.js采用了這個規范。 根據CommonJS規范，一個單獨的文件就是一個模塊。加載模塊使用require方法，該方法讀 取一個文件并執行，最后返回文件內部的exports對象。
? ??他又說了，可以用在下面這些場景 ?，所以他更明顯的偏向服務器端。當然你也可以把它用在瀏覽器里邊（他們自己說可以）。
·???????Server-side JavaScript applications
·???????Command line tools
·???????Desktop GUI-based applications
·???????Hybrid applications (Titanium, Adobe AIR)
（2）、AMD規范
Commonjs解決了模塊化的問題，并且可以用在瀏覽器中，但是Commonjs是同步加載模塊，當要用到該模塊了，現加載現用，這種同步機制到了瀏覽器里邊就有問題了，加載速度啊啥的（覽器同步加載模塊會導致性能、可用性、調試和跨域訪問等問題）。
鑒于瀏覽器的特殊情況，又出現了一個規范，這個規范呢可以實現異步加載依賴模塊，并且會提前加載那就是AMD規范。AMD可以作為CommonJS模塊一個中轉的版本只要CommonJS沒有被用來同步的require調用。使用同步require調用的CommonJS代碼可以被轉換為使用回調風格的AMD模塊加載器（https://github.com/amdjs/amdjs-api/wiki/AMD-(%E4%B8%AD%E6%96%87%E7%89%88)?（它說的）。
下面是一個使用了簡單CommonJS轉換的模塊定義（它是amd規范的一種用法）：
?? define(function (require, exports, module) {
???? var a = require('a'),
???????? b = require('b');
?
???? exports.action = function () {};
?? });
所以說AMD和Commonjs是兼容的，只要稍稍調換一下調用方法就實現了同步加載（我很懷疑amd也是在commonjs基礎上加了個殼，然后并沒有找到其他的神馬說明和支持的文字，找到了一定加到這）。
看一下AMD規范你會發現，AMD基本都是提前說明依賴模塊，然后預加載這些模塊，實際上這就要求你提前想好這些依賴，提前寫好，不然寫代碼過程中要回到開頭繼續添加依賴。
（3）、CMD
不知道是不是針對這個問題，淘寶的玉伯大牛搞了個seajs出來，并聲稱這個規范是遵循CMD規范的，然后給出了這個規范的一個連接（打開會發現draft字樣）。關于這個規范呢玉伯在知乎是這么說的
”AMD 是 RequireJS 在推廣過程中對模塊定義的規范化產出。
CMD 是 SeaJS 在推廣過程中對模塊定義的規范化產出。
類似的還有 CommonJSModules/2.0 規范，是 BravoJS 在推廣過程中對模塊定義的規范化產出。
還有不少??
“
? 所以這個規范實際上是為了Seajs的推廣然后搞出來的。那么看看SeaJS是怎么回事兒吧，基本就是知道這個規范了。
同樣Seajs也是預加載依賴js跟AMD的規范在預加載這一點上是相同的，明顯不同的地方是調用，和聲明依賴的地方。AMD和CMD都是用difine和require，但是CMD標準傾向于在使用過程中提出依賴，就是不管代碼寫到哪突然發現需要依賴另一個模塊，那就在當前代碼用require引入就可以了，規范會幫你搞定預加載，你隨便寫就可以了。但是AMD標準讓你必須提前在頭部依賴參數部分寫好（沒有寫好？ 倒回去寫好咯）。這就是最明顯的區別。
?
3、共生共處
由于CommonJS是服務器端的規范，更另外兩個標準實際不沖突。
AMD在國外用的更多，當然國內也是不少的，jQuery1,7版本開始使用，Dojo在1.6版本開始用，這已經能夠證明它足夠牛x了。
CMD當然也有很多人在用，但是基本都集中在國內，Seajs官網就展示了一大堆牛逼的公司在用（包括愛奇藝，騰訊微博，支付寶，淘寶等一大堆，去這看看http://seajs.org/docs/），估計小的不出名的也不計其數了，畢竟很多公司招聘都要求會seajs嘛。
? ? ? 所以三個規范目前都挺好（其實也主要是因為js么有自己的模塊加載機制，es6出來之后不知道會怎樣）。
當我們寫一個文件需要兼容不同的加載規范的時候怎么辦呢，看看下面的代碼。
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 | (function?(root, factory) { ? ????if?(typeof?define ===?'function'?&& define.amd) { ? ????????// AMD ? ????????define(['jquery',?'underscore'], factory); ? ????}?else?if?(typeof?exports ===?'object') { ? ????????// Node, CommonJS之類的 ? ????????module.exports = factory(require('jquery'), require('underscore')); ? ????}?else?{ ? ????????// 瀏覽器全局變量(root 即 window) ? ????????root.returnExports = factory(root.jQuery, root._); ? ????} ? }(this,?function?($, _) { ? ????// 方法 ? ????function?a(){};?// 私有方法，因為它沒被返回 (見下面) ? ????function?b(){};?// 公共方法，因為被返回了 ? ????function?c(){};?// 公共方法，因為被返回了 ? ?????? ? ????// 暴露公共方法 ? ????return?{ ? ????????b: b, ? ????????c: c ? ????} ? }));??? |
這個代碼可以兼容各種加載規范了。
4、AMD和CMD的區別
? ? ?下面這幾點是玉伯在知乎上說的。
?
1. 對于依賴的模塊，AMD 是提前執行，CMD 是延遲執行。不過 RequireJS 從 2.0 開始，也改成可以延遲執行（根據寫法不同，處理方式不同）。CMD 推崇 as lazy aspossible.
2. CMD 推崇依賴就近，AMD 推崇依賴前置。
?
3. AMD 的 API 默認是一個當多個用，CMD 的 API 嚴格區分，推崇職責單一。比如 AMD 里，require 分全局 require 和局部 require，都叫 require。CMD 里，沒有全局 require，而是根據模塊系統的完備性，提供 seajs.use 來實現模塊系統的加載啟動。CMD 里，每個 API 都簡單純粹。
?
4. 還有一些細節差異，具體看這個規范的定義就好，就不多說了。
? ? ?（ 好吧~第四點是不多說了。。。。。。。。。）
?
5、AMD和CMD的一些相同
都有difine和require，而且調用方式實際都可以添加依賴參數，也就是說都可以用提供依賴參數的方式來實現預加載依賴模塊（但是不推薦因為 ?注意：帶?id?和?deps?參數的?define?用法不屬于 CMD 規范，而屬于?Modules/Transport?規范。---來自：https://github.com/seajs/seajs/issues/242）。
? ? ?AMD也可以在factory中使用require來現加載用到的模塊，但是這個模塊就不會預先加載，屬于用到才加載的同步加載了。
? ??var?a?=?require('a');?//加載模塊a
轉載于:https://www.cnblogs.com/chaoyuehedy/p/11183946.html
總結
以上是生活随笔為你收集整理的理解AMD ，CMD，CommonJS规范的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： BZOJ3262/Luogu3810
- 下一篇： KNN总结