jquery中模塊化和組件化的區(qū)別:1、模塊化是將分屬同一功能/業(yè)務(wù)的代碼隔離(分裝)成獨(dú)立的模塊;而組件化是把重復(fù)的代碼提取出來合并成為一個個組件。2、模塊之間有依賴的關(guān)系,可通過路由器進(jìn)行模塊之間的耦合問題;而組件之間低依賴,比較獨(dú)立,每個組件單獨(dú)提出來也能正常使用,有很高的重用性。
本教程操作環(huán)境:windows7系統(tǒng)、jquery3.6.0版本、Dell G3電腦。
jquery中模塊化和組件化的區(qū)別
看圖哈 關(guān)系以及映射關(guān)系
1、什么是組件化和模塊化
組件:把重復(fù)的代碼提取出來合并成為一個個組件,組件最重要的就是重用(復(fù)用),位于框架最底層,其他功能都依賴于組件,可供不同功能使用,獨(dú)立性強(qiáng)。
模塊:分屬同一功能/業(yè)務(wù)的代碼進(jìn)行隔離(分裝)成獨(dú)立的模塊,可以獨(dú)立運(yùn)行,以頁面、功能或其他不同粒度劃分程度不同的模塊,位于業(yè)務(wù)框架層,模塊間通過接口調(diào)用,目的是降低模塊間的耦合,由之前的主應(yīng)用與模塊耦合,變?yōu)橹鲬?yīng)用與接口耦合,接口與模塊耦合。
2、組件化和模塊化的區(qū)別
組件:就像一個個小的單位,多個組件可以組合成組件庫,方便調(diào)用和復(fù)用,組件間也可以嵌套,小組件組合成大組件。
組件之間低依賴,比較獨(dú)立,每個組件單獨(dú)提出來也能正常使用,很高的重用性
模塊:就像是獨(dú)立的功能和項目(如淘寶:注冊、登錄、購物、直播…),可以調(diào)用組件來組成模塊,多個模塊可以組合成業(yè)務(wù)框架。
模塊之間有依賴的關(guān)系,可通過路由器進(jìn)行模塊之間的耦合問題。
3、為什么要使用組件化和模塊化?
-
開發(fā)和調(diào)試效率高:隨著功能越來越多,代碼結(jié)構(gòu)會越發(fā)復(fù)雜,要修改某一個小功能,可能要重新翻閱整個項目的代碼,把所有相同的地方都修改一遍,重復(fù)勞動浪費(fèi)時間和人力,效率低;使用組件化,每個相同的功能結(jié)構(gòu)都調(diào)用同一個組件,只需要修改這個組件,即可全局修改。
-
可維護(hù)性強(qiáng):便于后期代碼查找和維護(hù)。
-
避免阻斷:模塊化是可以獨(dú)立運(yùn)行的,如果一個模塊產(chǎn)生了bug,不會影響其他模塊的調(diào)用。
-
版本管理更容易:如果由多人協(xié)作開發(fā),可以避免代碼覆蓋和沖突。
下面來總結(jié)一下本文內(nèi)容:
組件:把重復(fù)的代碼提取出來合并成為一個個組件,組件最重要的就是重用(復(fù)用)
模塊:分屬同一功能/業(yè)務(wù)的代碼進(jìn)行隔離(分裝)成獨(dú)立的模塊,可以獨(dú)立運(yùn)行,獨(dú)立管理,每個模塊有很多接口,可供調(diào)用
組件化模塊化優(yōu)點(diǎn):開發(fā)調(diào)試效率高、可維護(hù)性強(qiáng)、避免阻斷、版本管理更容易