program study story

プログラムの勉強 アウトプット

Webアプリケーション_開発モデル

MVCとは

「Model」「View」「Controller」の3つに分割する。

ユーザーが直接参照・編集する情報から分離する。

Model・・アプリケーションが扱う領域のデータと手続きを表現する要素である。

また、データの変更をViewに通知するのもモデルの責任である。

(モデルの変更を通知するのにObserverパターンが用いられることもある)

View・・モデルのデータを取り出してユーザが見るのに適した形で表示する要素。

UIへの出力を担当。

例え:

Webアプリケーションでは、HTML文章を生成して動的にデータを表示するためのコードなどにあたる。

GUIにおいては通常、改装構造を成す。

Controller・・ユーザからの入力(通常イベントとして通知される)をモデルへのメッセージへと変換してモデルに伝える要素である。

UIからの入力を担当。

直接に描画を行ったり、モデルの内部データを直接操作したりはしない。

Webアプリケーションで扱われるMVCには、Model2MVCと呼ばれる派生のものが近いという。

MVC

ViewとModelが繋がっており、データのやり取りが発生する。

◇流れ

-----------------------------------------------------

ユーザーa

↓ ①ユーザーアクション

Controller(アクションからどの処理をするか依頼)

↓ ②処理依頼

Model(データを処理)

↓ ③処理済データの通知

View(表示反映処理)

↓ ④変更を表示

ユーザーa

-----------------------------------------------------

MVCの場合、Viewがユーザーのための表示にデータを加工したり、ユーザーの操作を補助したりと、Viewが膨大化する傾向にある。そして、ViewとModelが密結合するため、双方の作業を分担しづらいという特徴も。

◆Model2のMVCとは、

ViewとModelは直接繋がらずControllerを介して両者が接続される。

そのため、ViewとModelは独立し、基本ViewとModelはControllerを介してやりとりをする。

◇流れ

-----------------------------------------------------

ユーザーb

↓ ①ユーザーアクション

Controller

↓ ②データ処理・取得

Model

↓②データ処理・取得

Controller

↓③処理後データ通知

View

↓④変更を表示

ユーザーb

 -----------------------------------------------------

・特徴としては、ViewとModelが分かれるため、作業分担しやすくなる反面、2つの仲介を果たすので、Controllerの役割が大きくなりがちになること。

MVCとModel2MVCの判断

・デスクトップアプリなどのアプリケーションでMVCという場合は、MVCを指すことが多い。

RailsなどのWebアプリケーションでは、ModelMVCを指すことが多い。

WebアプリケーションがHTMLでの操作、表示が基本のため、従来のMVCよりもModel2MVCに沿った考え方の方が馴染みやすかったなのではと言われています。

■MVPとは

Model2MVCのModelとViewの結びつきをもっとに疎にしたもの。

「Model」「View」「Presenter」の3つに分割する。

MVCと同じようにパターンがあり、

・パッシブブュー(Passive View)

・監視コントローラ(Supervising Controller)

の2つに分かれる。

◆パッシブヴュー(Passive View)MVP

 ◇流れ

-----------------------------------------------------

ユーザーc

↓ ①ユーザーアクション

View

↓ ②アクション伝達

Presenter

↓ ③データ処理・取得

Model

↓ ③データ処理・取得

Presenter

↓ ④処理後データ反映

View

↓ ⑤変更を表示

ユーザーc

-----------------------------------------------------

Model2MVCと同じような流れですが、ModelとViewが完全に分離され、Presenterがその仲介を果たします。Model2MVCよりより分離するということが念頭に置かれている。

こちらもModel2MVC同様に仲介役のPresenterの役割が膨れる傾向にある。

そして、ユーザーからViewを通してPresenterという流れになっているのはModel2MCVとの違いの1つになるともいえる。

◇監視コントローラ(Supervising Controller)MVP

ViewがModelのデータに基づくUIを用意する場合

ViewがModelのデータ情報を監視(Obsserve)し、Modelの状態に応じて表示を変更する。

ただし、データの変更に関してはViewから直にModelを操作せずPresenterを挟んでModelへのデータ変更の処理を行う。

◇流れ

-----------------------------------------------------

ユーザーd

↓①ユーザーアクション

View

↓②アクション伝達

Presenter

↓③データ処理・取得

Model

↓③データ処理・取得

Presenter

-----------------------------------------------------

ViewはModelを常にデータの変更を監視又、

監視に追従し適宣表示変更をユーザーに行うことを行っている

特徴としては、

ユーザーアクションでViewが変わる場合はPresenterからViewに変更指示が届きますが、Model起因のデータの場合はPresenterを挟まずにView側でデータを直接参照して表示を行います。

ですから、モデル内のデータをそのまま表示させるような仕様の場合、効果を発揮します。

例え:

.監視しているModelの情報をView側でリスト表示。

.ユーザーがリスト表示させたデータを操作する。

.操作された内容をPresenterに通知させる。

.操作された内容に基づき、PresenterがModel側へデータの更新を依頼。

.依頼された内容に基づき、Model内のデータを更新。

.Model内の更新をView側の監視が察知し、リスト表示に反映させる。

監視を挟んでいることにより、Presenterからの操作のみという一貫性も担保、Viewからはデータが操作できず、Presenterを経由せずともデータの繁栄を察知することが可能。

PresenterからViewへのデータ加工のコストが減るためその分Presenterの膨大化を和らげることができる。

しかし、

MVC同様にViewとModelの密度が上がるので、ViewのデザインにModelが引っ張られる可能性がある。

■MVVMとは

双方向データバインディングという形でViewとViewModelを結びつけている。

 ◇流れ

-----------------------------------------------------

ユーザーe

 ユーザーアクション

  Bindにより適宣表示変更

View

 双方向(DataBind)→ユーザーアクションで入力数値等に変更があればViewModel

   側に反映

ViewModel

↕ データ処理・所得

Model

-----------------------------------------------------

双方向データバインドとは

データ(Data)を結びつける(Bind)する機能のこと。

監視コントローラ型のMVPで挙げた監視よりも更に密な考え方でUIとデータオブジェクトを結びつけて、同一のデータをやりとりできるようにしてUIが操作されるとデータ側も書き換えるような仕組みです。

また、双方向データバインディングの場合は、データが書き換えられていてもUIに反映。UI側の情報が書き換えられても反映というような相互でデータを更新をやりとりするイメージ。

ViewModelとは

Modelから取得したデータをバインディングできるようにデータを定義して表示と連動してデータが変更され、またデータに直接操作が必要な場合はModelへ操作を依頼するものとして存在するのが、ViewModel。

Modelのデータを直接ViewのUIで取り扱いできない場合でもViewModelを用意し中間に挟むことで実現できるようにしている。

 

MVVMとデータバインディング

データバインディングができて初めて適用できるモデル。データバインディングの機能を有していないフレームワークでは実現ができない。 

まとめ

MVCには、デスクトップアプリケーションとWebアプリケーションでは、MVCのモデルは異なる。

MVCとModel2MVC

MVPには、大きく2種類あり、

ViewとModelを監視する形で結びつける「監視コントロールMVP」

ViewとModelを完全に独立させ、Presenterで結ぶ「パッシブビューMVP」がある。

MVVMは、ViewModelというModelのデータをViewで扱いやすくするようなものを設けデータバインディングという機能を使い、データそのものを共有して行う。

 

それぞれの要素の関係性、要素が受け持つ範囲が違うため、MVC,MVPを利用時はどこまでがViewに相当するのか、ControllerやPresenterに相当するのか、担当範囲を明確にしておくことが必要。