iT邦幫忙

2018 iT 邦幫忙鐵人賽
DAY 18
1
Modern Web

Go!從無到打造最佳行動網站系列 第 18

Day18 依然廢文 什麼是MVC

為什麼會突然寫什麼是MVC,有一次在面試的時候,敘述了MVC是什麼,但面試的人卻說「不對」、「不對」,於是我反問他,我說的都不對那你說說看什麼是MVC,空氣中停頓了幾秒,他回我:「今天是誰要來面試的」(超級囂張xDD),從她回我那句後,他下面的問題我都拒絕回答,或是用很敷衍的態度回答他,ㄏㄏ,這公司後來連接他電話都不想。
所以透過這次鐵人賽,想在整理一下MVC之間的關係,以及各個entity所要做的事情。

有許多的Framework對MVC的實作有不一樣的方法,沒有一個非常正確的答案,MVC故名思議就是要把個的模組拆開來以方便維護。
許多公司也將MVC做為面試題目,儘管如此把握幾個原則,你也可以將MVC回答得很清楚

先上一張圖
MVC
在MVC的世界中,有許多爭議關於Model會不會與View互動,網路上打上MVC還有不同人解釋關於MVC三者之間的關係。

MVC是一種更高層級的架構,相對於大雜燴

今天透過整理這三個之間的用途,問了許多的同事及主管,去討論,其實大家對MVC在不同的看法與見解,沒有一定的答案。Web的世界中的前端與後端MVC也不盡然相同,整個系統的MVC也不相同,於是我下了一個結論

在程式架構中,能清楚分辨出Model、Controller、View的應用單元及資料流,可以說這就是MVC。

我們接下來要用一個例子來解釋MVC,幫助第一次接觸的人了解。

相信提款機大家都不陌生,當你需要錢的時候會用到他
今天有幾個角色分別扮演Model、 Controller、 View

  • 需要用錢的使用者 ( 飾)
  • Model (銀行 飾)
  • Controller (ATM題款機裡面 飾)
  • View (ATM題款機畫面 飾)

前情題要

有一個使用者急需用錢,走到了ATM面前...

他將卡片插入題款機(發出請求),接著ATM題款機(Controller)會將這個請求送到銀行(Model),然後銀行會回傳請使用者輸入密碼,這個將這個提示顯示在畫面上(View)。
step1

延續上個步驟,畫面顯示請使用者輸入密碼(View),使用者輸入密碼後,ATM題款機會收到密碼的資訊,並且將他加密後(Controller)再傳送致銀行驗證(Model),這個階段可以看出每個單元分別做屬於自己的事。
step2

後來發現,ATM的鈔票沒了,只好到下一家ATM了...

用一句話來描述MVC這三個單元

Model
在這個單元裡面,我們通常會定義資料的結構、型態、存取func,必要時會將資料的驗證寫在這個單元中。

Controller
負責處理主要商業邏輯處理,資料格式處理,大部分介於Model 與 View 之間,處理資料流的溝通。

View
將資料視覺化,並呈現給使用者。


上一篇
Day17 純、手工系列 Go (BeeGo Request篇)(下)
下一篇
Day19 純、手工系列 JS(Vue Axios篇)
系列文
Go!從無到打造最佳行動網站30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

2 則留言

0
royal801991
iT邦新手 5 級 ‧ 2017-12-28 13:31:39

黑絲 ♥
/images/emoticon/emoticon14.gif

/images/emoticon/emoticon81.gif

0
Summer
iT邦新手 3 級 ‧ 2017-12-28 20:19:23

這些圖到底哪裡找的?好神奇
/images/emoticon/emoticon30.gif

網路搜尋一下有很多

我要留言

立即登入留言