# 組件化的定義: 組件的出現，**就是為了拆分UI界面的功能，能夠讓我們以不同的組件，來劃分不同的功能模塊，將來我們需要什么樣的功能，就可以去調用對應的組件即可** Vue組件的組成 html(template)+css+js ## 組件化和模塊化的不同: 模塊化:是從**代碼邏輯的角度**進行劃分的;方便代碼分層開發，保證每個功能模塊的職能單一 組件化:是從**UI界面的角度**進行劃分的前端的組件化方便組件的重用 **舉個更明顯的例子：** 我們寫一個導航組件，需要用到很多js功能 如：中間的搜索功能，滾動后改變顏色；如果將功能全部書寫在組修的中，維護成功較高。那么可以將其抽離成不同的模塊。然后在組件中調用這些功能。 ## 總結 模塊化一般指的是可以被抽象封裝的最小/最優代碼集合，模塊化解決的是功能耦合問題； 組件化則更像是模塊化進一步封裝，根據業務特點或者不同的場景封裝出具有一定功能特性的獨立整體；另外，前端提到組件化更多的是具有模板、樣式和 js 交互的 UI 組件。 我們接下來的學習重點在于先學會使用Vue的組件，后面我們有時間來一一的進行深入探討。