CommonJS, AMD, CMD 筆記

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異步

CMDseajs推崇的規範,CMD則是依賴就近,用的時候再require。它寫起來是這樣的:

define(function(require, exports, module) {
   var clock = require('clock');
   clock.start();
});

 

這裏具體到使用的時候再來決定加載哪些文件,AMD  CMD都是異步加載.

總結:CommonJs主要針對服務端,AMD/CMD主要針對瀏覽器端,因此最容易混淆的是AMD/CMD。(順便提一下,針對服務器端和針對瀏覽器端有什麼本質的區別呢?服務器端通常採用同步加載文件,也就是說須要某個模塊,服務器端便停下來,等待它加載再執行。這裏若是有其餘後端語言,如java,經驗的‘玩家’應該更容易理解。而瀏覽器端要保證效率,須要採用異步加載,這就須要一個預處理,提早將所須要的模塊文件並行加載好。)

 

AMDCMD最大的區別是對依賴模塊的執行時機處理不一樣,而不是加載的時機或者方式不一樣,兩者皆爲異步加載模塊。
AMD依賴前置,js能夠方便知道依賴模塊是誰,當即加載;而CMD就近依賴,須要使用把模塊變爲字符串解析一遍才知道依賴了那些模塊

相關文章
相關標籤/搜索