MVC v.s. MVVM 學習筆記

更新於 2024/05/17閱讀時間約 3 分鐘

老梗的MVC v.s. MVVM🥸

紀錄個人理解,有錯請不吝糾正,感謝

MVC(Model-View-Controller)

MVC

MVC

  • Model:
    • 負責資料儲存、型別定義,當資料有變化時,通知controller
  • View:
    • 呈現UI畫面,接收使用者的輸入,通知controller
  • Controller:
    • Model和View之間的中介,接收使用者的輸入,然後根據這些輸入對Model進行操作,最後更新View以反映Model的變化。

優點:

  • 三大職責分離
  • View/Model可被重用

缺點:

  • 實際上商業邏輯跟UI容易混雜
  • 難寫測試

MVVM(Model-View-ViewModel)

MVVM

MVVM

  • Model:
    • 跟MVC的Model一樣,負責資料儲存、型別定義。
  • View:
    • 跟MVC的View一樣,負責呈現用戶界面,與MVC中的View相似。
  • ViewModel:
    • 作為View和Model之間的連接器,管理View所需的數據和狀態。使得View與Model解耦合,同時負責為View提供可綁定的數據。
最主要差異為用資料驅動view的更新(Data Binding),當資料異動時,去更新view

優點:

  • 商業邏輯跟UI可分開,比較不會出現Massive View Controller的問題
  • 容易寫測試

缺點:

  • Data Binding 會導致較大的記憶體消耗
  • View跟VM綁定,難重用

MVC v.s. MVVM最大差異?

個人覺得是在Controller跟ViewModel的更新的行為。

MVC收到通知需要Controller主動去觸發更新,MVVM則因為已經跟資料綁定,當資料的狀態發生變化時,ViewModel會被通知,然後通過綁定自動更新相應的View。這種更新是被動的,因為是由綁定機制隱式地觸發和管理的。

MVVM的商業邏輯應該寫在哪?

有人說可以寫在VM裡,有人寫在VM很差要寫在Model。

我覺得可能要看複雜度來決定,VM的主要功能是把原始資料轉換成給View顯示用的資料。如果邏輯跟這個View有關是OK的。但如果是與這個View無關的邏輯的話(Application logic),可以在VM和Model中間再做一個service layer,這個service也屬於Model的一部分。


參考資料:

https://ithelp.ithome.com.tw/articles/10289734

https://developer.apple.com/library/archive/documentation/General/Conceptual/DevPedia-CocoaCore/MVC.html

https://front-chef.coderbridge.io/2021/02/27/mvc-mvvm/

https://stackoverflow.com/questions/37671866/should-i-implement-business-logic-on-a-model-or-a-viewmodel

https://softwareengineering.stackexchange.com/questions/429244/the-right-place-for-app-logic-in-mvvm-context

avatar-img
7會員
35內容數
紀錄iOS開發上遇到的問題或是一些流程筆記。主要都是Swift。
留言0
查看全部
avatar-img
發表第一個留言支持創作者!
Michelle Chen的沙龍 的其他內容
在寫SwiftUI view的時候,碰到一個瓶頸(? 帶有Binding的參數要如何preview。 舉例來說有個右邊圖片左邊文字的View,給他一個@Binding var isActive: Bool的狀態,當active時圖片要跟著改變: struct RightImageView: Vie
雖然我之前文章大力讚美SwiftUI的tabView有多好用,無奈專案大部分都是UIKit啊~~~~要在既有專案用Tab架構只能用UITabBarController了 設計這次還出了一個超複雜的UI,陰影+圓角+客製化高度 大套餐 馬上開始吧。 圓角+陰影 重點就是subclass一個
Sandbox 架構 /Documents:主要用於儲存用戶生成的數據或者不能重新創建的數據。這些可能包括由你的應用程式創建的文件、從服務器下載的文件、用戶在應用程式中創建或修改的數據等。 這些數據在應用程式的生命週期中是持久保存的,即使應用程式被終止或者系統重啟,這些數據也會保留。此外
SwiftUI的TabView實在太好用啦!我要大大的推廣他ლ(╹◡╹ლ) 換頁+小圓點滑動 無限自動輪播 底部Tabbar
這個浮誇標題是ChatGPT幫我想的😊 圖也是DALL幫我產的, AI萬歲! GCD也是面試必問題啊!我答超爛的,只會用背景呼叫API+切Main Thread更新畫面,今天就來認真了解。 GCD是什麼? 先來問ChatGPT什麼是GCD? GCD,全名 Grand Central Dis
字數算法 = string.count? 在swift算一個string的字數時候,很直覺的會想到用.count來算 let s = "這是幾個字呢".count print(s.count) // 6 毫無疑問的安心信賴6個字 表情符號的場合 let emoji = "😂" print
在寫SwiftUI view的時候,碰到一個瓶頸(? 帶有Binding的參數要如何preview。 舉例來說有個右邊圖片左邊文字的View,給他一個@Binding var isActive: Bool的狀態,當active時圖片要跟著改變: struct RightImageView: Vie
雖然我之前文章大力讚美SwiftUI的tabView有多好用,無奈專案大部分都是UIKit啊~~~~要在既有專案用Tab架構只能用UITabBarController了 設計這次還出了一個超複雜的UI,陰影+圓角+客製化高度 大套餐 馬上開始吧。 圓角+陰影 重點就是subclass一個
Sandbox 架構 /Documents:主要用於儲存用戶生成的數據或者不能重新創建的數據。這些可能包括由你的應用程式創建的文件、從服務器下載的文件、用戶在應用程式中創建或修改的數據等。 這些數據在應用程式的生命週期中是持久保存的,即使應用程式被終止或者系統重啟,這些數據也會保留。此外
SwiftUI的TabView實在太好用啦!我要大大的推廣他ლ(╹◡╹ლ) 換頁+小圓點滑動 無限自動輪播 底部Tabbar
這個浮誇標題是ChatGPT幫我想的😊 圖也是DALL幫我產的, AI萬歲! GCD也是面試必問題啊!我答超爛的,只會用背景呼叫API+切Main Thread更新畫面,今天就來認真了解。 GCD是什麼? 先來問ChatGPT什麼是GCD? GCD,全名 Grand Central Dis
字數算法 = string.count? 在swift算一個string的字數時候,很直覺的會想到用.count來算 let s = "這是幾個字呢".count print(s.count) // 6 毫無疑問的安心信賴6個字 表情符號的場合 let emoji = "😂" print
你可能也想看
Google News 追蹤
Thumbnail
*合作聲明與警語: 本文係由國泰世華銀行邀稿。 證券服務係由國泰世華銀行辦理共同行銷證券經紀開戶業務,定期定額(股)服務由國泰綜合證券提供。   剛出社會的時候,很常在各種 Podcast 或 YouTube 甚至是在朋友間聊天,都會聽到各種市場動態、理財話題,像是:聯準會降息或是近期哪些科
Thumbnail
在軟體開發領域,MVC(Model-View-Controller)是一種被廣泛使用的設計模式,它有助於將應用程序的不同部分進行組織、分離,以實現更好的可維護性和可擴展性。本文將深入介紹MVC模式的核心概念,以及如何在您的項目中應用這種強大的架構。
Thumbnail
在履歷中常常看到導入 MVVM,然後問為什麼要導入 MVVM 時,最常聽到的答案是這樣不會有很肥大的 view controller,但如果再問 view controller 是 MVC 的那一個部分,很多人卻回答不出個所以然,所以想聊聊這個很多種說法的 MVC pattern。
MVC是一套網頁開發的架構流程,代表著從前端到後端的各自分工。 M: Model 多個 model 建立的 tables 們能夠透過 foreign_key 或是 belongs_to / has_one / has_many,將彼此的資料產生關聯。 V: View C: Controller
Thumbnail
這陣子開始摸 Elixir/Phoenix,對於裡面產生 MVC 相關檔案的指令稍微做個紀錄,免得要確認時還要翻來翻去 本圖的紀錄不包含 migration 檔跟測試檔
.NET MVC線上教學 — MIS2000Lab 課程大綱 與 試聽 自從我把影片上線以來,已經過了三年。 一路不斷的補充,現在的課程已經從「基礎的75小時」一路延伸到「完整版,超過90小時」 通常是學員發問,我再做增補(別的學員有問題,可能您也會遇見、也想學) 1–3 撰寫第一個類別檔。
這是ASP .NET WebAPI課程 ( https://9vs1.com/go/?i=f9a8ff53f717 ) 的補充,一個簡單的範例介紹[FromBody]。 假設User(Client端)從瀏覽器傳來JSON,WebAPI該怎麼接收並處理呢? 不需要自己動手解析 JSON文件內容,
實例參考 另記: 在controller內加入 [Authorize] 會強制先去登入。 ex: using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.We
在controller內加上ShowData["message"]="mvc 測試";  public ActionResult Login()  { ShowData["message"]="mvc 測試";  return View();  } view內加上處理判斷 @{    if (S
編輯 view /_ViewStart.cshrml 到您要使用的 view檔名即可。 原來 @{     Layout = "_Layout"; } 新檔 @{     Layout = "NewLayout"; } 
Thumbnail
適合對象:想學習 ASP.NET網頁程式(後端、MVC)、資料庫入門與應用。課程最後提供一個「線上相簿」的專案與完整解說。 從零開始學起。第一堂課(5.5小時 完整內容)免費讓您觀賞。看完了,喜歡再付錢。請來信申請。 不用擔心自己程度不好,第一天「完整」課程  看完了再說  .......
Thumbnail
*合作聲明與警語: 本文係由國泰世華銀行邀稿。 證券服務係由國泰世華銀行辦理共同行銷證券經紀開戶業務,定期定額(股)服務由國泰綜合證券提供。   剛出社會的時候,很常在各種 Podcast 或 YouTube 甚至是在朋友間聊天,都會聽到各種市場動態、理財話題,像是:聯準會降息或是近期哪些科
Thumbnail
在軟體開發領域,MVC(Model-View-Controller)是一種被廣泛使用的設計模式,它有助於將應用程序的不同部分進行組織、分離,以實現更好的可維護性和可擴展性。本文將深入介紹MVC模式的核心概念,以及如何在您的項目中應用這種強大的架構。
Thumbnail
在履歷中常常看到導入 MVVM,然後問為什麼要導入 MVVM 時,最常聽到的答案是這樣不會有很肥大的 view controller,但如果再問 view controller 是 MVC 的那一個部分,很多人卻回答不出個所以然,所以想聊聊這個很多種說法的 MVC pattern。
MVC是一套網頁開發的架構流程,代表著從前端到後端的各自分工。 M: Model 多個 model 建立的 tables 們能夠透過 foreign_key 或是 belongs_to / has_one / has_many,將彼此的資料產生關聯。 V: View C: Controller
Thumbnail
這陣子開始摸 Elixir/Phoenix,對於裡面產生 MVC 相關檔案的指令稍微做個紀錄,免得要確認時還要翻來翻去 本圖的紀錄不包含 migration 檔跟測試檔
.NET MVC線上教學 — MIS2000Lab 課程大綱 與 試聽 自從我把影片上線以來,已經過了三年。 一路不斷的補充,現在的課程已經從「基礎的75小時」一路延伸到「完整版,超過90小時」 通常是學員發問,我再做增補(別的學員有問題,可能您也會遇見、也想學) 1–3 撰寫第一個類別檔。
這是ASP .NET WebAPI課程 ( https://9vs1.com/go/?i=f9a8ff53f717 ) 的補充,一個簡單的範例介紹[FromBody]。 假設User(Client端)從瀏覽器傳來JSON,WebAPI該怎麼接收並處理呢? 不需要自己動手解析 JSON文件內容,
實例參考 另記: 在controller內加入 [Authorize] 會強制先去登入。 ex: using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.We
在controller內加上ShowData["message"]="mvc 測試";  public ActionResult Login()  { ShowData["message"]="mvc 測試";  return View();  } view內加上處理判斷 @{    if (S
編輯 view /_ViewStart.cshrml 到您要使用的 view檔名即可。 原來 @{     Layout = "_Layout"; } 新檔 @{     Layout = "NewLayout"; } 
Thumbnail
適合對象:想學習 ASP.NET網頁程式(後端、MVC)、資料庫入門與應用。課程最後提供一個「線上相簿」的專案與完整解說。 從零開始學起。第一堂課(5.5小時 完整內容)免費讓您觀賞。看完了,喜歡再付錢。請來信申請。 不用擔心自己程度不好,第一天「完整」課程  看完了再說  .......