我們要進行模塊化開發(fā)呢届囚？
模塊化開發(fā)的好處主要有這么幾點：
1.使用模塊化開發(fā)能解決文件之間的依賴關(guān)系竿屹。
當你引入很多個JS文件的時候各淀，很有可能會不清楚這些JS文件之間的依賴關(guān)系盾鳞，從而導致加載順序出錯犬性。使用模塊化開發(fā)之后就能避免這個問題。
2.使用模塊化開發(fā)可以避免命名的沖突腾仅。
JS本身是沒有命名空間的乒裆，為了減少命名沖突，經(jīng)常使用對象或者閉包來減少命名沖突推励。對象只能減少命名沖突的概率鹤耍，閉包的過多使用會造成內(nèi)存泄漏。模塊化開發(fā)之后验辞，在模塊內(nèi)任何形式的命名都不會和其他模塊的命名產(chǎn)生沖突稿黄，有效的解決了命名沖突的問題。
3.使用模塊化開發(fā)能進行代碼的復用跌造。
當我們想要實現(xiàn)某個功能的時候杆怕，如果某個模塊正好有這個功能，我們就可以直接引用該模塊壳贪，不必再寫多余的代碼陵珍，這樣可以提高代碼整體的效率，減少重復冗余的代碼违施。
組件化開發(fā)和模塊化開發(fā)概念辨析
網(wǎng)上有許多講組件化開發(fā)互纯、模塊化開發(fā)的文章，但大家一般都是將這兩個概念混為一談的磕蒲，并沒有加以區(qū)分伟姐。而且實際上許多人對于組件收苏、模塊的區(qū)別也不甚明了亿卤，甚至于許多博客文章專門解說這幾個概念都有些謬誤愤兵。
想分清這兩個概念我覺得結(jié)合一下軟件的漸進式開發(fā)場景更容易理解。但是下面的篇幅會比較長排吴，所以我先說結(jié)論秆乳，不耐煩的同學可以先看：
概念區(qū)別
說明
- 組件：最初的目的是代碼重用，功能相對單一或者獨立钻哩。在整個系統(tǒng)的代碼層次上位于最底層屹堰，被其他代碼所依賴，所以說組件化是縱向分層街氢。
- 模塊：最初的目的是將同一類型的代碼整合在一起扯键，所以模塊的功能相對復雜，但都同屬于一個業(yè)務(wù)珊肃。不同模塊之間也會存在依賴關(guān)系荣刑，但大部分都是業(yè)務(wù)性的互相跳轉(zhuǎn)，從地位上來說它們都是平級的伦乔。
因為從代碼組織層面上來區(qū)分厉亏，組件化開發(fā)是縱向分層，模塊化開發(fā)是橫向分塊烈和，所以模塊化并沒有要求一定組件化爱只。也就是說你可以只做模塊化開發(fā)，而不做組件化開發(fā)招刹。那這樣的結(jié)果是什么樣的呢恬试？就是說你的代碼完全不考慮代碼重用，只是把相同業(yè)務(wù)的代碼做內(nèi)聚整合疯暑，不同模塊之間還是存在大量的重復代碼训柴。這樣的成果也算是做到了模塊化，只不過我們一般不會這樣而已缰儿。
和組件模塊近似的一對概念是庫和框架畦粮。庫的概念偏近于代碼的堆集，是分層的概念乖阵，所以對應(yīng)組件化宣赔。框架是結(jié)構(gòu)化的代碼瞪浸，所以應(yīng)用于模塊化儒将。框架是骨对蒲，模塊化是肉钩蚊。
比如贡翘，ReactiveCocoa是庫，只是提供了響應(yīng)式編碼能力砰逻，而基于此的MVVM具體實現(xiàn)成果才叫框架鸣驱，因為框架本身就有架構(gòu)思想在里面。
舉例
下面我們舉例來說明蝠咆。
組件化就比如公共的alert框踊东，最初在許多頁面都有使用，后面提取出一份相同的代碼刚操，其實就是基于代碼復用的目的闸翅。
模塊化就比如一個資訊功能，它本身只在這一個地方使用菊霜，沒有復用的需求坚冀，但系統(tǒng)啟動的時候要初始化它的數(shù)據(jù)，首頁顯示的時候要展示它的數(shù)據(jù)鉴逞，顯示紅點的時候要拉取它的未讀數(shù)记某。這樣一來應(yīng)用中就有很多地方涉及到它的代碼。如果我們將它看做一個整體华蜒，那么資訊模塊和主應(yīng)用的耦合性就非常高了辙纬。所以我們也要把它封裝成模塊，把相關(guān)的代碼放到獨立的單元文件里叭喜，并提供公共方法贺拣，這就是高內(nèi)聚的要求。
漸進式開發(fā)過程
當然這幾個概念在服務(wù)端開發(fā)和客戶端開發(fā)領(lǐng)域有些微差別捂蕴，我下面的例子就從移動端開發(fā)的角度上進行辨析譬涡。
首先我們定義一個虛擬的產(chǎn)品——一款知識類應(yīng)用，包含咨詢啥辨、問答涡匀、學院、直播等功能溉知。
接下來我們逐步拆分這個產(chǎn)品陨瘩。
如果開發(fā)時沒有考慮任何組件化模塊化開發(fā)，那么此應(yīng)用的所有功能都是堆積在一起的级乍，總結(jié)起來就是高耦合舌劳，低內(nèi)聚，無重用玫荣。
1.組件
那么代碼重構(gòu)的第一步是什么呢甚淡？
將重復的代碼合并成為一份，也就是重用捅厂。
我們來看組件化開發(fā)的定義贯卦，它的著重點就是重用资柔，那這一步最后的結(jié)果就是提煉出一個個組件給不同的功能使用。
這里我們可以看一下依賴關(guān)系撵割，是具體功能依賴提煉出來的組件贿堰，組件本身之間可能也有依賴關(guān)系，但一般不多睁枕。所以我們總結(jié)組件化開發(fā)的原則就是高重用官边，低依賴。當然這只是相對而言外遇。
基于這樣的認識，我們甚至于可以把資訊契吉、問答跳仿、學院、直播等功能封裝成組件捐晶，只不過這些組件比較大菲语，依賴可能多些，不過本質(zhì)上沒有多少區(qū)別惑灵，而且實際上網(wǎng)上許多文章說所的模塊化開發(fā)其實就是這種組件化的“模塊”山上。
2.模塊
下面再說模塊，按照模塊的定義英支，它是以關(guān)注點進行劃分的佩憾，關(guān)注點說到底就是功能，也就是說根據(jù)我們上面的例子干花，資訊妄帘、問答、學院池凄、直播可以分成不同的模塊抡驼。
我們最開始定義這個虛擬產(chǎn)品的時候說，它有三個特點——高耦合肿仑、低內(nèi)聚致盟、無重用。而第一點組件化開發(fā)主要是解決了重用問題尤慰，提升了部分內(nèi)聚馏锡，而耦合問題則沒有涉及。
所以說我們上面可以將這個產(chǎn)品在邏輯上劃分為資訊割择、問答眷篇、學院、直播四個模塊荔泳，但在代碼層面上它們卻不是四個模塊蕉饼，因為它們的代碼都是混雜在一起的虐杯。比如產(chǎn)品首頁，可能推薦了部分資訊昧港、顯示了熱門問答擎椰、推送了目前的直播，而這些功能的代碼則是寫在一起的创肥；再比如程序啟動的時候达舒，這四個模塊都需要初始化一些數(shù)據(jù)，而初始化數(shù)據(jù)的代碼也是寫在一起的叹侄；再比如程序需要顯示未讀消息數(shù)巩搏，而這幾個模塊都有自己的未讀消息數(shù)邏輯。
如果未進行模塊化開發(fā)的拆分趾代，那么很多時候不同模塊的同一類的代碼都是直接寫在一起的贯底，比如系統(tǒng)啟動的時候，我們會在啟動方法里直接寫多個模塊的初始化代碼撒强。
而模塊化開發(fā)就是為了解決這一問題禽捆，即提高內(nèi)聚，將分屬同一模塊代碼放到一起飘哨；降低耦合胚想，將不同模塊間的耦合程度弱化。
高內(nèi)聚是目標芽隆，但是現(xiàn)狀是有許多地方會用到多個模塊浊服，比如啟動的時候會調(diào)用四個模塊，首頁會展示三個模塊的界面摆马。如果要高內(nèi)聚臼闻，那么必然需要這些模塊為不同的場景提供相同的方法，這就是說所有模塊要實現(xiàn)同一套多個接口囤采。這樣主應(yīng)用和模塊之間的重耦合就變成了主應(yīng)用和接口耦合述呐，接口和模塊耦合這樣的松耦合。
但這樣的簡單模塊只是輕模塊蕉毯，統(tǒng)一接口較少乓搬。而統(tǒng)一定義的接口越多，模塊和統(tǒng)一接口的耦合就越高代虾，也便是重模塊进肯。
而我們一般講的路由問題其實只是解決模塊間耦合的問題，并不是模塊化開發(fā)的必然需求棉磨，更多時候是基于產(chǎn)品上的動態(tài)化要求江掩，只不過我們一般都會在這個時間考慮這一事情而已，就像我們不會只做模塊化開發(fā)同時不做組件化開發(fā)一樣。
講到這里环形，模塊和組件的區(qū)別就已經(jīng)很明顯了策泣。
