模塊化的基本概念

什么是模塊化

模塊化是指解決一個(gè)復(fù)雜問(wèn)題時(shí)，自頂向下逐層把系統(tǒng)劃分成若干模塊的過(guò)程。對(duì)于整個(gè)系統(tǒng)來(lái)說(shuō)，模塊是可組合、分解和更換的單元。

模塊是Node.js 應(yīng)用程序的基本組成部分，文件和模塊是一一對(duì)應(yīng)的。換言之，一個(gè) Node.js 文件就是一個(gè)模塊，這個(gè)文件可能是JavaScript 代碼、JSON 或者編譯過(guò)的C/C++ 擴(kuò)展。

編程領(lǐng)域中的模塊化，就是遵守固定的規(guī)則，把一個(gè)大文件拆成獨(dú)立并互相依賴(lài)的多個(gè)小模塊。

模塊化拆分的好處

• 提高了代碼的復(fù)用性；
• 提高了代碼的可維護(hù)性；
• 可以實(shí)現(xiàn)按需加載。

Node.js中的模塊化

Node.js中模塊的分類(lèi)

Node.js 中根據(jù)模塊來(lái)源的不同，將模塊分為了 3 大類(lèi)，分別是：

1、內(nèi)置模塊（內(nèi)置模塊是由 Node.js 官方提供的，例如 fs、path、http 等）

2、自定義模塊（用戶(hù)創(chuàng)建的每個(gè) .js 文件，都是自定義模塊）

3、第三方模塊（由第三方開(kāi)發(fā)出來(lái)的模塊，并非官方提供的內(nèi)置模塊，也不是用戶(hù)創(chuàng)建的自定義模塊，使用前需要先下載）

加載模塊

使用 require() 方法，可以加載需要的內(nèi)置模塊、用戶(hù)自定義模塊、第三方模塊進(jìn)行使用。

//加載內(nèi)置的 fs 模塊
const fs = require('fs')
 
//加載用戶(hù)自定義的模塊
const custom = require('./custom.js')
 
//加載第三方模塊
const moment = require('moment')

注意：使用require()方法加載其他模塊時(shí)，會(huì)執(zhí)行被加載模塊中的代碼

模塊作用域

和函數(shù)作用域類(lèi)似，在自定義模塊中定義的變量、方法等成員，只能在當(dāng)前模塊內(nèi)被訪問(wèn)，這種模塊級(jí)別的訪問(wèn)限制，叫做模塊作用域。

//文件：01.custom.js
const username = '張三'    //在模塊作用域中定義常量username
function sayHello(){
   console.log('大家好，我是：'+username)   //在模塊作用域中定義函數(shù)sayHello
}
 
//文件：02.custom.js
const custom = require('./01.custom')   //導(dǎo)入01.custom文件
console.log(custom)  
//輸出{}空對(duì)象，在02.custom.js模塊中無(wú)法訪問(wèn)01.custom.js模塊中的私有成員

向外共享模塊作用域中的成員

module對(duì)象

在每個(gè) .js自定義模塊中都有一個(gè)module對(duì)象，它里面存儲(chǔ)了和當(dāng)前模塊有關(guān)的信息。

在自定義模塊中，可以使用 module.exports 對(duì)象，將模塊內(nèi)的成員共享出去，供外界使用。 外界用 require() 方法導(dǎo)入自定義模塊時(shí)，得到的就是 module.exports 所指向的對(duì)象。

注意：使用 require() 方法導(dǎo)入模塊時(shí)，導(dǎo)入的結(jié)果，永遠(yuǎn)以 module.exports 指向的對(duì)象為準(zhǔn)

例如：

//文件：01.custom.js
module.exports.username = 'zs'  //向module.exports對(duì)象上掛載屬性u(píng)sername
module.exports.sayHello = function(){
   console.log('Hello')   //在模塊作用域中定義函數(shù)sayHello
}
module.exports = {    //讓module.exports指向一個(gè)全新的對(duì)象
   nickname:'小明',
   sayHi(){
     console.log('Hi!')
   }
}
 
//文件：02.custom.js
const custom = require('./01.custom.js')   //導(dǎo)入01.custom文件
console.log(custom)  
//輸出{ nickname:'小明',sayHi:[Function:sayHi]}

exports對(duì)象

由于 module.exports 單詞寫(xiě)起來(lái)比較復(fù)雜，為了簡(jiǎn)化向外共享成員的代碼，Node 提供了 exports 對(duì)象。默認(rèn)情況 下，exports 和 module.exports 指向同一個(gè)對(duì)象。最終共享的結(jié)果，還是以 module.exports 指向的對(duì)象為準(zhǔn)。

exports和 module.exports的使用誤區(qū)

require()模塊時(shí)，得到的永遠(yuǎn)是 module.exports指向的對(duì)象。因此為了防止混亂，建議不要在同一個(gè)模塊中同時(shí)使用exports和 module.exports。

注意：每個(gè)模塊內(nèi)部，module變量代表當(dāng)前模塊；

module變量是一個(gè)對(duì)象，它的exports屬性(即 module.exports)是對(duì)外的接口

加載某個(gè)模塊，其實(shí)是加載該模塊的 module.exports屬性，require()方法用于加載模塊。

npm與包

包

Node.js 中的第三方模塊又叫做包。 就像電腦和計(jì)算機(jī)指的是相同的東西，第三方模塊和包指的是同一個(gè)概念，只不過(guò)叫法不同。

由于 Node.js 的內(nèi)置模塊僅提供了一些底層的 API，導(dǎo)致在基于內(nèi)置模塊進(jìn)行項(xiàng)目開(kāi)發(fā)時(shí)，效率很低。 包是基于內(nèi)置模塊封裝出來(lái)的，提供了更高級(jí)、更方便的 API，極大的提高了開(kāi)發(fā)效率。 包和內(nèi)置模塊之間的關(guān)系，類(lèi)似于 jQuery 和 瀏覽器內(nèi)置 API 之間的關(guān)系。

如何下載包

npm, Inc. 公司提供了一個(gè)包管理工具，我們可以使用這個(gè)包管理工具，從 https://registry.npmjs.org/  服務(wù)器把需要的包下載到本地使用。 這個(gè)包管理工具的名字叫做 Node Package Manager（簡(jiǎn)稱(chēng) npm 包管理工具），這個(gè)包管理工具隨著 Node.js 的安 裝包一起被安裝到了用戶(hù)的電腦上。 大家可以在終端中執(zhí)行 npm -v 命令，來(lái)查看自己電腦上所安裝的 npm 包管理工具的版本。

首先運(yùn)用window徽標(biāo)加R打開(kāi)，并輸入cmd，打開(kāi)窗口輸入npm -v。

在項(xiàng)目中安裝包的命令

我所使用的軟件為WebStorm2021，以下的指令都是在WebStorm2021軟件的終端下進(jìn)行的。

 npm  install  包的完整名稱(chēng)    （在執(zhí)行 npm install 命令時(shí)，如果在后面加上 -g 參數(shù)，則會(huì)把包安裝為全局包。）

在安裝包完成后，我們會(huì)看到項(xiàng)目文件夾下多一個(gè)叫node_modules 的文件夾和 package-lock.json 的配置文件。

node_modules 文件夾用來(lái)存放所有已安裝到項(xiàng)目中的包。require() 導(dǎo)入第三方包時(shí)，就是從這個(gè)目錄中查找并加載包。 package-lock.json 配置文件用來(lái)記錄 node_modules 目錄下的每一個(gè)包的下載信息，例如包的名字、版本號(hào)、下載地址等。

說(shuō)明：安裝包必須在網(wǎng)絡(luò)環(huán)境優(yōu)良的情況下進(jìn)行。 

安裝指定版本的包

使用 npm install 命令安裝包的時(shí)候，會(huì)自動(dòng)安裝最新版本的包。如果需要安裝指定版本的包，可以在包名之后，通過(guò) @ 符號(hào)指定具體的版本。例如：npm  install  moment@2..22.2

說(shuō)明：可以運(yùn)行 npm install 命令（或 npm i）一次性安裝所有的依賴(lài)包。(是在剔除了 node_modules 的項(xiàng)目之后的情況下)。

卸載包

卸載包的命令為：npm  uninstall  包的完整名稱(chēng)

解決下包速度慢的問(wèn)題

為什么下包速度慢

在使用 npm 下包的時(shí)候，默認(rèn)從國(guó)外的 https://registry.npmjs.org/ 服務(wù)器進(jìn)行下載，此時(shí)，網(wǎng)絡(luò)數(shù)據(jù)的傳輸需要經(jīng) 過(guò)漫長(zhǎng)的海底光纜，因此下包速度會(huì)很慢。

解決方法一——淘寶NPM鏡像服務(wù)器

淘寶在國(guó)內(nèi)搭建了一個(gè)服務(wù)器，專(zhuān)門(mén)把國(guó)外官方服務(wù)器上的包同步到國(guó)內(nèi)的服務(wù)器，然后在國(guó)內(nèi)提供下包的服務(wù)。 從而極大的提高了下包的速度。（鏡像（Mirroring）是一種文件存儲(chǔ)形式，一個(gè)磁盤(pán)上的數(shù)據(jù)在另一個(gè)磁盤(pán)上存在一個(gè)完全相同的副本即為鏡像）

解決方法二——切換npm的下包鏡像源

下包的鏡像源，指的就是下包的服務(wù)器地址。

解決方法三——nrm

為了更方便的切換下包的鏡像源，我們可以安裝 nrm 這個(gè)小工具，利用 nrm 提供的終端命令，可以快速查看和切換下包的鏡像源

總結(jié)

本篇文章就到這里了，希望能夠給你帶來(lái)幫助，也希望您能夠多多關(guān)注腳本之家的更多內(nèi)容！

最新評(píng)論