復雜的軟件必須有清晰合理的架構,否則無法開發和維護。
MVC(Model-View-Controller)是最常見的軟件架構之一,業界有著廣泛應用。它本身很容易理解,但是要講清楚,它與衍生的 MVP 和 MVVM 架構的區別就不容易了。
昨天晚上,我讀了《Scaling Isomorphic Javascript Code》,突然意識到,它們的區別非常簡單。我用幾段話,就可以說清。
(題圖:攝于瓦倫西亞,西班牙,2014年8月)
一、MVC
MVC模式的意思是,軟件可以分成三個部分。
- 視圖(View):用戶界面。
- 控制器(Controller):業務邏輯
- 模型(Model):數據保存
各部分之間的通信方式如下。
View 傳送指令到 Controller
Controller 完成業務邏輯后,要求 Model 改變狀態
Model 將新的數據發送到 View,用戶得到反饋
所有通信都是單向的。
二、互動模式
接受用戶指令時,MVC 可以分成兩種方式。一種是通過 View 接受指令,傳遞給 Controller。
另一種是直接通過controller接受指令。
三、實例:Backbone
實際項目往往采用更靈活的方式,以 Backbone.js 為例。
用戶可以向 View 發送指令(DOM 事件),再由 View 直接要求 Model 改變狀態。
用戶也可以直接向 Controller 發送指令(改變 URL 觸發 hashChange 事件),再由 Controller 發送
給 View。Controller 非常薄,只起到路由的作用,而 View 非常厚,業務邏輯都部署在 View。所以,Backbone 索性取消了 Controller,只保留一個 Router(路由器) 。
四、MVP
MVP 模式將 Controller 改名為 Presenter,同時改變了通信方向。
各部分之間的通信,都是雙向的。
View 與 Model 不發生聯系,都通過 Presenter 傳遞。
View 非常薄,不部署任何業務邏輯,稱為"被動視圖"(Passive View),即沒有任何主動性,而 Presenter非常厚,所有邏輯都部署在那里。
五、MVVM
MVVM 模式將 Presenter 改名為 ViewModel,基本上與 MVP 模式完全一致。
唯一的區別是,它采用雙向綁定(data-binding):View的變動,自動反映在 ViewModel,反之亦然。Angular 和 Ember 都采用這種模式。
(完)