1. 程式人生 > >MVC、MVP、MVVM-作者: 阮一峰

MVC、MVP、MVVM-作者: 阮一峰

MVC(Model-View-Controller)是最常見的軟體架構之一,業界有著廣泛應用。它本身很容易理解,但是要講清楚,它與衍生的 MVP 和 MVVM 架構的區別就不容易了。

(題圖:攝於瓦倫西亞,西班牙,2014年8月)

一、MVC

MVC模式的意思是,軟體可以分成三個部分。

  • 檢視(View):使用者介面。
  • 控制器(Controller):業務邏輯
  • 模型(Model):資料儲存

各部分之間的通訊方式如下。

  1. View 傳送指令到 Controller
  2. Controller 完成業務邏輯後,要求 Model 改變狀態
  3. Model 將新的資料傳送到 View,使用者得到反饋

所有通訊都是單向的。

二、互動模式

接受使用者指令時,MVC 可以分成兩種方式。一種是通過 View 接受指令,傳遞給 Controller。

另一種是直接通過controller接受指令。

三、例項:Backbone

實際專案往往採用更靈活的方式,以 Backbone.js 為例。

1. 使用者可以向 View 傳送指令(DOM 事件),再由 View 直接要求 Model 改變狀態。

2. 使用者也可以直接向 Controller 傳送指令(改變 URL 觸發 hashChange 事件),再由 Controller 傳送給 View。

3. Controller 非常薄,只起到路由的作用,而 View 非常厚,業務邏輯都部署在 View。所以,Backbone 索性取消了 Controller,只保留一個 Router(路由器) 。

四、MVP

MVP 模式將 Controller 改名為 Presenter,同時改變了通訊方向。

1. 各部分之間的通訊,都是雙向的。

2. View 與 Model 不發生聯絡,都通過 Presenter 傳遞。

3. View 非常薄,不部署任何業務邏輯,稱為"被動檢視"(Passive View),即沒有任何主動性,而 Presenter非常厚,所有邏輯都部署在那裡。

五、MVVM

MVVM 模式將 Presenter 改名為 ViewModel,基本上與 MVP 模式完全一致。

唯一的區別是,它採用雙向繫結(data-binding):View的變動,自動反映在 ViewModel,反之亦然。

AngularEmber 都採用這種模式。


相關推薦

MVCMVPMVVM-作者

MVC(Model-View-Controller)是最常見的軟體架構之一,業界有著廣泛應用。它本身很容易理解,但是要講清楚,它與衍生的 MVP 和 MVVM 架構的區別就不容易了。 (題圖:攝於瓦倫西亞,西班牙,2014年8月) 一、MVC MVC模式的意思是,軟體可

Flex 布局教程語法篇 作者

num 完全 tutorials eight 項目 default size webkit http 網頁布局(layout)是 CSS 的一個重點應用。 布局的傳統解決方案,基於盒狀模型,依賴 display 屬性 + position屬性 + float屬性。它對於那

網際網路協議入門(二) 作者

上一篇文章分析了網際網路的總體構思,從下至上,每一層協議的設計思想。這是從設計者的 角度但問題,今天我想切換到使用者的角度,看看使用者時如何從上至下,與這些協議互動的。 (接上文) 一個小結 先對前面的內容,做一個小結。 我們已經知道,網路通訊就是交

Flex 佈局教程語法篇 作者 日期 2015年7月10日 網頁佈局(layout)是 CSS 的一個重點應用。 佈局的傳統解決方案,基於盒狀模型,依賴 display 屬性 + po

網頁佈局(layout)是 CSS 的一個重點應用。 佈局的傳統解決方案,基於盒狀模型,依賴 display 屬性 + position屬性 + float屬性。它對於那些特殊佈局非常不方便,比如,垂直居中就不容易實現。 2009年,W3C 提出了一種新的方案----Flex 佈局,可以簡

Flex 布局教程實例篇

side web figure title borde 無法 ref .com 1.2 作者: 阮一峰 日期: 2015年7月14日 上一篇文章介紹了Flex布局的語法,今天介紹常見布局的Flex寫法。 你會看到,不管是什麽布局,Flex往往都可以幾行命令搞定。 我只列

Javascript面向對象編程(二)構造函數的繼承 作者yuan

技術分享 share ava 修改 enca end 日期 意思 生成 Javascript面向對象編程(二):構造函數的繼承 作者: 阮一峰 日期: 2010年5月23日 這個系列的第一部分,主要介紹了如何"封裝"數據和方法,以及如何從原型對象生成實例。

Android 程序架構 MVCMVPMVVMUnidirectionalClean...

不同 概念 可能 十年 tin gettext 聲明 數據 content 摘選自:GUI 應用程序架構的十年變遷:MVC、MVP、MVVM、Unidirectional、Cleanhttps://zhuanlan.zhihu.com/p/26799645 MV

Android 架構設計MVCMVPMVVM和元件化

MVC、MVP和MVVM是常見的三種架構設計模式,當前MVP和MVVM的使用相對比較廣泛,當然MVC也並沒有過時之說。而所謂的元件化就是指將應用根據業務需求劃分成各個模組來進行開發,每個模組又可以編譯成獨立的APP進行開發。理論上講,元件化和前面三種架構設計不是

介面之下還原真實的 MVCMVPMVVM 模式

一、前言 做客戶端開發、前端開發對MVC、MVP、MVVM這些名詞不瞭解也應該大致聽過,都是為了解決圖形介面應用程式複雜性管理問題而產生的應用架構模式。網上很多文章關於這方面的討論比較雜亂,各種MV*模式之間的區別分不清,甚至有些描述都是錯誤的。本文追根溯

Android App 的設計架構MVCMVPMVVM 的分析

MVC框架模式一樣,Model模型處理資料程式碼不變在Android的App開發中,很多人經常會頭疼於App的架構如何設計: 我的App需要應用這些設計架構嗎? MVC,MVP等架構講的是什麼?區別是什麼? 本文就來帶你分析一下這幾個架構的特性,優缺點,以及App架構設計中

【框架篇】mvcmvpmvvm使用關系總結

mvc模型 details eset 網站架構 特性 自動 分享 規模 arch MVC MVC全名是Model View Controller,是模型(model)-視圖(view)-控制器(controller)的縮寫,一種軟件設計典範,用一種業務邏輯、數據、界面顯

MVCMVPMVVM模式對比總結(2)橫向構架模型

span del nec 處理請求 eth .cn pos 實現 通過 前言說明 在實戰項目及學習中來總結一下Android端項目構架 包括MVC、MVP、MVVM,主要針對移動Android端 該篇只描述橫向構架模型 目錄 1.構架基礎 2.橫向構架模型 3.縱向

淺談MVCMVPMVVM架構模式的區別和聯系

.html csdn 獲取 視圖 viewmodel url title tle htm 淺談MVC、MVP、MVVM架構模式的區別和聯系 學習了:http://www.cnblogs.com/guwei4037/p/5591183.html http://blog.csd

從Script到Code BlocksCode Behind到MVCMVPMVVM

主題 描述 傳輸 對象之間的關系 方法 動力 基本 com load() 剛過去的周五(3-14)例行地主持了技術會議,主題正好是《UI層的設計模式——從Script、Code Behind到MVC、MVP、MVVM》,是前一天晚上才定的,中午花了半小時準備了下就開講了。

Android中MVCMVPMVVM具體解釋

line 業務邏輯 指令 問題 今天 操作 才幹 入口 pre 前言 今天有時間就剛好有想寫關於這幾個名詞。對於我來說。事實上這麽多名詞、思想歸根究竟就是要依據項

MVCMVPMVVM之間的關系

mvp 工作 更多 lan mod 技術 https v-model 產生 介紹   寫這篇隨筆完全是為了加深自己的印象,畢竟寫比看能獲得得更多,另外本人對這三種模式的認識還是淺薄的,有待在以後的工作學習中有更深入的理解,因此不免會有誤解,這裏推薦大家閱讀廖雪峰關於MVV

IOS —— MVCMVPMVVM 隨筆

以前做IOS開發工作的時候,部門領導苦口婆心的給我科普過MVC和MVVM的區別,簡要來說MVC框架臃腫,分工不明,只勝在程式碼量少。 MVVM程式碼量繁多、勝在框架分工明確便於除錯及應用。 當然那都是一倆年前對於當時剛入行作為菜雞的自己,對於這個框架的理解 現在重新來根據圖文講講來自三者的功能及區別。

【iOS】MVCMVPMVVM

MVC MVC模式涉及三種物件:模型物件、檢視物件、控制器物件。模型物件中儲存有應用程式的資料,檢視物件負責顯示模型物件的資料,並且允許使用者對其進行編輯。控制器物件是模型物件和檢視物件之間的協調者,負責對模型物件進行初始化,並將模型物件傳遞給檢視物件進行解析顯示。  

三層架構MVCMVPMVVM簡介

1. 三層架構 三層架構就是將整個業務應用劃分為: UI層:介面層(User Interface layer) BLL層:業務邏輯層(Business Logic Layer) DAL層:資料訪問層(Data access layer) 區分層次的目的是為了

android原始碼設計模式——框構模式MVCMVPMVVM

一、框架模式、設計模式、架構模式的概念理解        通常來講框架面向於一系列相同行為程式碼的重用,而設計則面向的是一系列相同結構程式碼的重用,通常所說的架構則介於框架與設計之間 二、MVC、MVP、MVVM三種設計模式        2.1、MVC模式,常見的應用模式,