什么是模塊化?本篇文章給大家深度解析一下Node模塊化的那些事,希望對(duì)大家有所幫助!
node.js極速入門課程:進(jìn)入學(xué)習(xí)
什么是模塊化
模塊化是指
解決一個(gè)復(fù)雜問(wèn)題時(shí),自頂向下逐層把系統(tǒng)劃分成若干模塊的過(guò)程
。對(duì)于整個(gè)系統(tǒng)來(lái)說(shuō),模塊是可組合、分解和更換的單元。
在上方的定義中未免有一些晦澀難懂,簡(jiǎn)單的給大家舉個(gè)例子:我們小時(shí)候玩的小霸王游戲機(jī),當(dāng)我們玩煩了一款游戲的時(shí)候,我們不可能直接更換一個(gè)游戲機(jī)呀,我們可以通過(guò)更換游戲帶從而體驗(yàn)各種不同的游戲。這種形式就是模塊化,把游戲分化成一個(gè)個(gè)小模塊,當(dāng)我們需要它的時(shí)候拿過(guò)來(lái)插入使用即可!
在我們的編程中的模塊化,其實(shí)就是遵循固定的規(guī)則
,把一個(gè)大文件拆分成為一個(gè)個(gè)獨(dú)立并且相互依賴
的多個(gè)小模塊。【相關(guān)教程推薦:nodejs視頻教程】
代碼進(jìn)行模塊拆分的好處:
提高了代碼的
復(fù)用性
提高了代碼的
可維護(hù)性
可以實(shí)現(xiàn)
按需加載
(這個(gè)真的是嘎嘎好用!)
模塊化規(guī)范
模塊化規(guī)范就是
對(duì)代碼進(jìn)行模塊化的拆分與組合時(shí),需要遵守的那些規(guī)則。
例如:
?1. 使用什么樣的語(yǔ)法格式來(lái)引用模塊
?2. 在模塊中使用什么樣的語(yǔ)法格式向外暴露成員
模塊化規(guī)范的好處:大家都遵守同樣的模塊化規(guī)范寫代碼,降低了溝通的成本,極大方便了各個(gè)模塊之間的相互調(diào)用,利人利己。(黑馬哥總結(jié)的真到位
)
node.js中的模塊分類
Node.js 中根據(jù)模塊來(lái)源的不同,將模塊分為了 3 大類,分別是:
? 1. 內(nèi)置模塊
(內(nèi)置模塊是由 Node.js 官方提供的,例如 fs、path、http 等)
? 2. 自定義模塊
(用戶創(chuàng)建的每個(gè) .js 文件,都是自定義模塊)
? 3. 第三方模塊
(由第三方開(kāi)發(fā)出來(lái)的模塊,并非官方提供的內(nèi)置模塊,也不是用戶創(chuàng)建的自定義模塊,使用前需要先下載)
我們?cè)谝陨衔恼轮幸呀?jīng)學(xué)了常用的內(nèi)置模塊,剩下的兩個(gè)模塊相對(duì)來(lái)說(shuō)沒(méi)有什么特點(diǎn),比較的依賴于開(kāi)發(fā)者的需求!
使用強(qiáng)大的
require()
方法,可以加載需要的內(nèi)置模塊、用戶自定義模塊、第三方模塊
進(jìn)行使用.注意:
使用 require() 方法加載其它模塊時(shí),會(huì)執(zhí)行被加載模塊中的代碼
。
node.js的模塊作用域
和函數(shù)作用域類似,在自定義模塊中定義的變量、方法等成員,只能在當(dāng)前模塊內(nèi)被訪問(wèn)
,這種模塊級(jí)別的訪問(wèn)限制,叫做模塊作用域。
代碼示例:
//在模塊作用域中定義常量 name const name = 'qianmo' //在模塊作用域中定義函數(shù)sing() function sing() { console.log(`大家好,我是${name}`); }
//在測(cè)試js文件中加載模塊 const a = require('./08.模塊作用域') console.log(a); // {}
在上述代碼中,我們?cè)谀K作用域中定義了常量和方法,但是在測(cè)試的js文件中加載模塊后去打印,我們發(fā)現(xiàn)打印出來(lái)的是
空對(duì)象
。這是因?yàn)槟K作用域中的屬性和方法是私有成員,我們?cè)诩虞d模塊的時(shí)候無(wú)法訪問(wèn)到!
模塊作用域的好處其實(shí)就只有一個(gè):防止全局變量污染的問(wèn)題
在上述代碼中,我們引入了兩個(gè)js文件,在js文件中都同時(shí)定義了變量a
,我們打印a之后,發(fā)現(xiàn)打印出來(lái)的是zs
,在這里我們就可以發(fā)現(xiàn)一個(gè)問(wèn)題,2.js
文件覆蓋了1.js
,這就反應(yīng)出來(lái)了一個(gè)問(wèn)題,當(dāng)我們定義全局變量的時(shí)候容易造成變量污染,node的模塊化可以很好的幫助我們解決這個(gè)問(wèn)題!?
向外共享模塊作用域中的成員
在每個(gè) .js 自定義模塊中都有一個(gè) module 對(duì)象,
它里面存儲(chǔ)了和當(dāng)前模塊有關(guān)的信息
我們打印一下module,console.log(module)
:
在自定義模塊中,可以使用
module.exports
對(duì)象,將模塊內(nèi)的成員共享出去,供外界使用
。
外界用require()
方法導(dǎo)入自定義模塊時(shí),得到的就是 module.exports 所指向的對(duì)象
。
代碼示例:
// 在默認(rèn)情況下 module.exports = {} const age = 20 //向 module.exports 對(duì)象上掛載 name 屬性 module.exports.name = '正式' //向 module.exports 對(duì)象上掛載 sing 方法 module.exports.sing = function() { console.log('hello'); } module.exports.age = age //讓 module.exports 指向一個(gè)全新的對(duì)象 module.exports = { username : 'qianmo', hi() { console.log('你好啊!'); } }
// 在外界使用require 導(dǎo)入一個(gè)自定義模塊的時(shí)候 得到的成員。 // 就是 那個(gè)模塊中,通過(guò) module.exports 指向的那個(gè)對(duì)象 const m1 = require('./11.自定義模塊') console.log(m1); // { username: 'qianmo', hi: [Function: hi] }
在測(cè)試js文件中,我們打印了引入的模塊,發(fā)現(xiàn)打印出來(lái)了
module.exports最后指定的對(duì)象
注意:使用 require() 方法導(dǎo)入模塊時(shí),導(dǎo)入的結(jié)果,永遠(yuǎn)以 module.exports 指向的對(duì)象為準(zhǔn)。
由于 module.exports 單詞寫起來(lái)比較復(fù)雜,
為了簡(jiǎn)化向外共享成員的代碼,Node 提供了 exports 對(duì)象
。默認(rèn)情況下,exports 和 module.exports 指向同一個(gè)對(duì)象
。最終共享的結(jié)果,還是以 module.exports 指向的對(duì)象為準(zhǔn)
。
代碼示例:
console.log(exports); // {} console.log(module.exports); // {} console.log(exports === module.exports); // true
在我們進(jìn)行對(duì)exports對(duì)象解析之前,我們需要確定一下exports
與module.exports
是不是指向的是一個(gè)對(duì)象,我們可以看出,最后打印出了true
,說(shuō)明exports
與module.exports
指向的是一個(gè)對(duì)象!
const username = 'zs' exports.username = username exports.age = 20 exports.sayHello = function() { console.log('大家好!'); } //最終向外共享的結(jié)果,永遠(yuǎn)是 module.exports 所指向的對(duì)象
const m = require('./13.exports對(duì)象') console.log(m); //{ username: 'zs', age: 20, sayHello: [Function (anonymous)] }
在上述的代碼中,我們?cè)谒接心K中定義了屬性和方法,我們通過(guò)
exports
將屬性和方法導(dǎo)出,在測(cè)試文件中引入,我們會(huì)發(fā)現(xiàn),測(cè)試文件中打印出了屬性和方法。
exports 和 module.exports 的使用誤區(qū)
時(shí)刻謹(jǐn)記,使用
require()
引入模塊時(shí),得到的永遠(yuǎn)是module.exports 指向的對(duì)象
:
-
在第一個(gè)圖中,module.exports指向一個(gè)新對(duì)象,所以在測(cè)試文件中,只會(huì)打印出來(lái)
{gender:'男',age:22}
-
在第二個(gè)圖中,雖然exports指向了一個(gè)新對(duì)象,但是我們知道我們只會(huì)打印出來(lái)
module.exports
指向的對(duì)象,所以我們只能打印出來(lái)一個(gè)屬性{username : 'zs'}
-
在第三個(gè)圖中,exports和
module.exports
都沒(méi)有指定一個(gè)新對(duì)象,我們還知道,在默認(rèn)情況下exports和module.exports指向的是一個(gè)對(duì)象
,所以最終打印出來(lái){username : 'zs',gender:'男'}
-
在第四個(gè)圖中,exports指向了一個(gè)新對(duì)象,但是最終這個(gè)對(duì)象又賦值給了
module.exports
,所以,最后打印出了{username:'zs',gender:'男',age:22}
? 注意 : 不要在一個(gè)文件中同時(shí)使用
exports
和module.exports
,防止混淆
Node.js 中的模塊化規(guī)范(commonJS)
Node.js 遵循了
CommonJS 模塊化規(guī)范
,CommonJS 規(guī)定了模塊的特性
和各模塊之間如何相互依賴
。
CommonJS 規(guī)定:
① 每個(gè)模塊內(nèi)部,module 變量代表當(dāng)前模塊
。
② module 變量是一個(gè)對(duì)象,它的 exports 屬性(即 module.exports)是對(duì)外的接口
。
③ 加載某個(gè)模塊,其實(shí)是加載該模塊的 module.exports 屬性
。require() 方法用于加載模塊。
小結(jié)
模塊化是node.js最大的特點(diǎn),在前端的項(xiàng)目開(kāi)發(fā)中,模塊化已經(jīng)成為了必不可少的部分,
我們?cè)趘ue中使用的組件化其實(shí)就是模塊化的概念
,前端只要學(xué)透了模塊化,那么你的函數(shù)封裝能力,按需調(diào)用的能力將會(huì)大大提升,這樣的話將會(huì)極大限度的提升你的項(xiàng)目開(kāi)發(fā)效率。