1. 程式人生 > >了解JS模塊規範:AMD,CMD,CommonJS

了解JS模塊規範:AMD,CMD,CommonJS

requirejs 請求 sea pre 發展 區別 script 處理 環境

隨著JS模塊化編程的發展,處理模塊之間的依賴關系成為了維護的關鍵。

AMD,CMD,CommonJS是目前最常用的三種模塊化書寫規範。

CommonJS

CommonJS規範是誕生比較早的。Node.js(是一個Javascript運行環境(runtime))就采用了CommonJS。是這樣加載模塊:

// foo.js
module.exports = function(x) {
  console.log(x);
};

// main.js
var foo = require("./foo");
foo("Hi");

這種寫法適合服務端,因為在服務器讀取模塊都是在本地磁盤,加載速度很快。但是如果在客戶端,加載模塊的時候有可能出現“假死”狀況。比如上面的例子中clock的調用必須等待clock.js請求成功,加載完畢。

AMD

AMD,即 (Asynchronous Module Definition),這種規範是異步的加載模塊,requireJs應用了這一規範。先定義所有依賴,然後在加載完成後的回調函數中執行:

require([module], callback);

用AMD寫上一個模塊:

require([‘clock‘],function(clock){
  clock.start();
});

AMD雖然實現了異步加載,但是開始就把所有依賴寫出來是不符合書寫的邏輯順序的,能不能像commonJS那樣用的時候再require,而且還支持異步加載後再執行呢?

CMD

CMD (Common Module Definition), 是seajs推崇的規範,CMD則是依賴就近,用的時候再require。它寫起來是這樣的:

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

AMD和CMD最大的區別是對依賴模塊的執行時機處理不同,而不是加載的時機或者方式不同,二者皆為異步加載模塊。
AMD依賴前置,js可以方便知道依賴模塊是誰,立即加載;而CMD就近依賴,需要使用把模塊變為字符串解析一遍才知道依賴了那些模塊,這也是很多人詬病CMD的一點,犧牲性能來帶來開發的便利性,實際上解析模塊用的時間短到可以忽略。



作者:乘著風
鏈接:http://www.jianshu.com/p/09ffac7a3b2c
來源:簡書
著作權歸作者所有。商業轉載請聯系作者獲得授權,非商業轉載請註明出處。

了解JS模塊規範:AMD,CMD,CommonJS