您好,登錄后才能下訂單哦!
這篇文章主要介紹“amd、cmd、esmodule、commonjs區別是什么”的相關知識,小編通過實際案例向大家展示操作過程,操作方法簡單快捷,實用性強,希望這篇“amd、cmd、esmodule、commonjs區別是什么”文章能幫助大家解決問題。
AMD、CMD、ESModule和CommonJS是JavaScript中最常用的模塊化規范。
AMD規范(Asynchronous Module Definition,異步模塊定義)是RequireJS在推廣模塊化開發的過程中提出的一種規范。該規范的主要特點是異步加載模塊,這樣可以在需要時才去加載模塊,提高頁面加載速度。AMD規范的代碼示例如下:
//定義模塊 define(['module1', 'module2'], function(m1, m2) { //... return module; }); //使用模塊 require(['module'], function(module) { //... });
在AMD規范中,使用define函數來定義一個模塊,require函數來加載一個模塊。在define函數中,第一個參數是一個數組,表示該模塊依賴的其他模塊;第二個參數是一個回調函數,表示該模塊的代碼。在回調函數中,我們可以使用依賴的模塊,并將模塊作為返回值。在require函數中,第一個參數也是一個數組,表示需要加載的模塊;第二個參數是一個回調函數,在該函數中可以使用已加載的模塊。
CMD規范(Common Module Definition,通用模塊定義)是SeaJS在推廣模塊化開發的過程中提出的一種規范。該規范與AMD規范類似,也是異步加載模塊,但是它的代碼風格更加簡潔。CMD規范的代碼示例如下:
//定義模塊 define(function(require, exports, module) { var m1 = require('module1'); var m2 = require('module2'); //... module.exports = module; }); //使用模塊 var module = require('module');
在CMD規范中,使用define函數來定義一個模塊,require函數來加載一個模塊。在define函數中,回調函數的參數可以自定義,但是一般情況下第一個參數是require,表示依賴其他模塊的方法;第二個參數是exports,表示該模塊對外輸出的方法和屬性;第三個參數是module,表示該模塊自身。在回調函數中,我們可以使用require函數來加載其他模塊,并將需要輸出的方法和屬性添加到exports對象上。在require函數中,只需要傳入需要加載的模塊名稱即可。
ESModule規范(ES6 Module,ES6模塊)是ECMAScript 6在語言層面上提供的模塊化規范。該規范采用靜態編譯的方式來進行模塊化,也就像前面兩種規范,ESModule也支持異步加載模塊。但是它的語法與前兩種規范有很大的不同。ESModule規范的代碼示例如下:
//定義模塊 export function module() { //... } //使用模塊 import { module } from 'module';
在ESModule規范中,使用export關鍵字來將模塊的方法和屬性輸出,使用import關鍵字來加載其他模塊。在export關鍵字后面,可以跟著一個函數或者變量名,表示需要輸出的方法或屬性。在import關鍵字后面,可以跟著需要加載的模塊名稱和需要導入的方法或屬性。
ESModule的語法比較簡潔,而且具有很好的可讀性,這是因為ESModule采用了語言層面上的支持。與前兩種規范不同,ESModule規范不需要使用額外的庫來實現模塊化,而是使用了標準的語法來支持。
CommonJS規范是Node.js在推廣模塊化開發的過程中提出的一種規范。該規范與前三種規范的最大區別在于它采用同步加載模塊的方式。CommonJS規范的代碼示例如下:
//定義模塊 var module1 = require('module1'); var module2 = require('module2'); //使用模塊 var module = require('module');
在CommonJS規范中,使用require函數來加載其他模塊,并將需要使用的模塊賦值給變量。在使用模塊時,只需要使用require函數來加載即可。
由于CommonJS規范是Node.js在推廣模塊化開發的過程中提出的一種規范,因此它在服務器端的應用非常廣泛。但是在瀏覽器端的應用中,CommonJS規范的同步加載方式可能會導致頁面加載速度變慢,因此在瀏覽器端的應用中,更多地使用異步加載模塊的規范,比如AMD和CMD。
關于“amd、cmd、esmodule、commonjs區別是什么”的內容就介紹到這里了,感謝大家的閱讀。如果想了解更多行業相關的知識,可以關注億速云行業資訊頻道,小編每天都會為大家更新不同的知識點。
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。