- 為什么要使用模塊化较性？
1解決命名沖突用僧，避免全局污染
2解決依賴管理
3提高代碼可讀性
4提高復(fù)用性 - 原始寫法
function fn1(){
//todo
}
function fn2(){
//todo
}
- 對(duì)象寫法
var obj = {
var a : 1,
fn1 : function (){
//todo
},
fn2 : function (){
//todo
}
};
- 立即執(zhí)行函數(shù)寫法: 模塊化的基礎(chǔ),模塊外部無(wú)法修改我們沒(méi)有暴露出來(lái)的變量结胀、函數(shù)。
var Fn = function()({
var a = 1;
var b = 2;
function fn1() {
//todo
}
function fn2() {
//todo
}
return {
fn1: fn1,
fn2: fn2
}
})()
CMD责循、AMD糟港、CommonJS 規(guī)范分別指什么？有哪些應(yīng)用
-
CommonJS : NodeJS提出的服務(wù)器端的模塊化規(guī)范沼死。只運(yùn)行在服務(wù)器端的規(guī)范，不能運(yùn)行在瀏覽器端崔赌。規(guī)范規(guī)定每個(gè)文件就是一個(gè)模塊意蛀，有獨(dú)自的作用域健芭，module代表當(dāng)前模塊，exports屬性就是它的一個(gè)接口慈迈，在加載時(shí)，使用require()
來(lái)加載這個(gè)模塊痒留，exports來(lái)提供接口谴麦。
CommonJS規(guī)范的寫法
用CommonJS規(guī)范運(yùn)行在服務(wù)器上 AMD：Asynchronous Module Definition匾效，運(yùn)行在瀏覽器端模塊化開(kāi)發(fā)的規(guī)范。使用該規(guī)范的有requireJS面哼。AMD規(guī)范加載模塊需要把所有的模塊都寫入?yún)?shù)里，用多少寫多少魔策。AMD也采用require()語(yǔ)句加載模塊，但是不同于CommonJS河胎，它要求兩個(gè)參數(shù)：
require([module], callback);
-
CMD：Common Module Definition，運(yùn)行在瀏覽器端模塊化開(kāi)發(fā)的規(guī)范游岳。使用該規(guī)范的有SeaJS。CMD規(guī)范的寫法與CommonJS規(guī)范相似吭历，區(qū)別在于使用define包裹代碼堕仔。
CMD規(guī)范 AMD與CMD區(qū)別：
模塊定義時(shí)對(duì)依賴的處理不同
AMD推崇依賴前置，在定義模塊的時(shí)候就要聲明其依賴的模塊
CMD推崇就近依賴晌区，只有在用到某個(gè)模塊的時(shí)候再去require同為異步加載模塊的區(qū)別：
AMD在加載模塊完成后就會(huì)執(zhí)行該模塊摩骨，所有模塊都加載執(zhí)行完后會(huì)進(jìn)入require的回調(diào)函數(shù)執(zhí)行主邏輯通贞，這樣的效果就是依賴模塊的執(zhí)行順序和書寫順序不一定一致，看網(wǎng)絡(luò)速度恼五，哪個(gè)先下載下來(lái)昌罩，哪個(gè)先執(zhí)行，但是主邏輯一定在所有依賴加載完成后才執(zhí)行灾馒。
CMD加載完某個(gè)依賴模塊后并不執(zhí)行茎用，只是下載而已，在所有依賴模塊加載完成后進(jìn)入主邏輯睬罗，遇到require語(yǔ)句的時(shí)候才執(zhí)行對(duì)應(yīng)的模塊轨功，這樣模塊的執(zhí)行順序和書寫順序是完全一致的。性能較好容达，只有用戶需要時(shí)才執(zhí)行
饑人谷課件
阮一峰：模塊化編程
模塊化開(kāi)發(fā)的價(jià)值
本博客版權(quán)歸 本人和饑人谷所有古涧，轉(zhuǎn)載需說(shuō)明來(lái)源
