MVC框架最早出現(xiàn)在Java領(lǐng)域，然后慢慢在前端開(kāi)發(fā)中也被提到，后來(lái)又出現(xiàn)了MVP，以及現(xiàn)在最成熟的MVVM，下面我們來(lái)簡(jiǎn)單介紹一下各種模式。

MVC

MVC全名是Model View Controller，是模型(model)-視圖(view)-控制器(controller)的縮寫(xiě)，一種軟件設(shè)計(jì)典范，用一種業(yè)務(wù)邏輯、數(shù)據(jù)、界面顯示分離的方法組織代碼，將業(yè)務(wù)邏輯聚集到一個(gè)部件里面，在改進(jìn)和個(gè)性化定制界面及用戶(hù)交互的同時(shí)，不需要重新編寫(xiě)業(yè)務(wù)邏輯。

• Model(模型)是應(yīng)用程序中用于處理應(yīng)用程序數(shù)據(jù)邏輯的部分。
• View(視圖)是應(yīng)用程序中處理數(shù)據(jù)顯示的部分。
• Controller(控制器)是應(yīng)用程序中處理用戶(hù)交互的部分。

通常控制器負(fù)責(zé)從視圖讀取數(shù)據(jù)，控制用戶(hù)輸入，并向模型發(fā)送數(shù)據(jù)。
優(yōu)點(diǎn)： 耦合性低、重用性高、生命周期成本低、部署快、可維護(hù)性高、有利軟件工程化管理
缺點(diǎn)： 由于模型和視圖要嚴(yán)格的分離，這樣也給調(diào)試應(yīng)用程序帶來(lái)了一定的困難。每個(gè)構(gòu)件在使用之前都需要經(jīng)過(guò)徹底的測(cè)試。
對(duì)于小項(xiàng)目，MVC反而會(huì)帶來(lái)更大的工作量以及復(fù)雜性。
接受用戶(hù)指令時(shí)，MVC 可以分成兩種方式。一種是通過(guò) View 接受指令，傳遞給 Controller。

另一種是直接通過(guò)controller接受指令。

MVP

MVP是單詞Model View Presenter的首字母的縮寫(xiě)，分別表示數(shù)據(jù)層、視圖層、發(fā)布層，它是MVC架構(gòu)的一種演變。作為一種新的模式，MVP與MVC有著一個(gè)重大的區(qū)別：在MVP中View并不直接使用Model，它們之間的通信是通過(guò)Presenter (MVC中的Controller)來(lái)進(jìn)行的，所有的交互都發(fā)生在Presenter內(nèi)部，而在MVC中View會(huì)直接從Model中讀取數(shù)據(jù)而不是通過(guò) Controller。
MVP 模式將 Controller 改名為 Presenter，同時(shí)改變了通信方向。

• 各部分之間的通信，都是雙向的。
• View 與 Model 不發(fā)生聯(lián)系，都通過(guò) Presenter 傳遞。
• View 非常薄，不部署任何業(yè)務(wù)邏輯，稱(chēng)為"被動(dòng)視圖"（Passive View），即沒(méi)有任何主動(dòng)性，而 Presenter非常厚，所有邏輯都部署在那里。

MVVM

MVVM(Model View ViewModel)是一種基于MVC的設(shè)計(jì)，開(kāi)發(fā)人員在HTML上寫(xiě)一些Bindings,利用一些指令綁定，就能在Model和ViewModel保持不變的情況下，很方便的將UI設(shè)計(jì)與業(yè)務(wù)邏輯分離，從而大大的減少繁瑣的DOM操作。
相比前面兩種模式，MVVM 模式只是把MVC的Controller和MVP的Presenter 改名為 ViewModel，它采用雙向綁定（data-binding）：View的變化會(huì)自動(dòng)更新到ViewModel，ViewModel的變化也會(huì)自動(dòng)同步到View上顯示。MVVM代表框架有：Knockout、Ember.js、AngularJS、Vue.js。

Model

作為MV*家族中的一員，MVVM中的M代表著Model。Model代表我們整個(gè)webapp所需要的數(shù)據(jù)模型，一個(gè)典型的例子就是用戶(hù)信息Model,它應(yīng)該含有(姓名，年齡等屬性)。Model含有大量信息，但它并不具有任何行為邏輯，它只是數(shù)據(jù)，因而它不會(huì)影響瀏覽器如何展示數(shù)據(jù)。

View

View這個(gè)詞出現(xiàn)頻率最多的地方應(yīng)該是MVC。在MVC設(shè)計(jì)中，View是唯一與用戶(hù)交互的地方，或者說(shuō)它是Model變化后的直觀反映。在MVVM中，View被認(rèn)為是主動(dòng)的而非被動(dòng)的。一個(gè)被動(dòng)的View時(shí)只它只能任由“他人”（Controller）擺布，自己卻不能改變?nèi)魏螙|西，如利用jQuery操作DOM。而MVVM中View是具有主動(dòng)性的，因?yàn)樗艘恍?shù)據(jù)綁定，事件，和行為，這些都會(huì)直接影響Model和ViewModel的。它不但負(fù)責(zé)保持View自身的行為（展示），而還會(huì)將自身的變化同步到ViewModel中。

ViewModel

ViewModel可以被看作是MVC中的Controller,它主要負(fù)責(zé)數(shù)轉(zhuǎn)換（用一定的業(yè)務(wù)邏輯），它負(fù)責(zé)將Model的變化反應(yīng)到View上，而當(dāng)View自身有變化時(shí)也會(huì)同步Model進(jìn)行改變。你可以把ViewModel看作一個(gè)藏在View后面的好幫手，它把View需要的數(shù)據(jù)暴露給它，并且富于View一定的行為能力。

!

?

?

轉(zhuǎn)自：https://www.kancloud.cn/dataoedu/vue/289126

超強(qiáng)干貨來(lái)襲 云風(fēng)專(zhuān)訪：近40年碼齡，通宵達(dá)旦的技術(shù)人生

總結(jié)

以上是生活随笔為你收集整理的MVC、MVP、MVVM分别是什么？有什么区别？的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。