Model View ViewModel

提供: MonoBook
ナビゲーションに移動 検索に移動

Model View ViewModel(略称:MVVM)とは、ユーザーインターフェイスUI)を構築するためのデザインパターンのひとつです。

概要[編集 | ソースを編集]

最近流行の仮想化プログラミングにおけるデザインパターンとして取り入れたものです。大雑把にいえば、実体の無い「仮想的なUI」である「ビューモデル」を用意して、そこで動作検証を済ませようというものです。

利点と欠点[編集 | ソースを編集]

利点[編集 | ソースを編集]

欠点[編集 | ソースを編集]

総評[編集 | ソースを編集]

ITドカタたちが高層ビルのような壮大なシステムを建造する際の技法であり、日曜プログラマーが犬小屋のような小物アプリを作る際に使うような代物ではない。まさに適材適所であり、小物であればMVCの方がいいです。

MVVMの構造[編集 | ソースを編集]

モデル(Model)[編集 | ソースを編集]

MVVMにおけるモデルとは、ビジネスロジックを記述する部分である。 いわゆるMVCパターンのモデルと同じものである。

プレゼンテーション層、ドメイン層、データソース層の3層からなるドメイン駆動設計(通称:DDD)の思想に乗っ取れば、モデルはドメイン層に相当するものであるが、一般的にはその下のデータソース層までを含む。それどころかデータソース層にSQLなどを用いて読み書きしているだけというシステムも多い。

ビューモデル(ViewModel)[編集 | ソースを編集]

MVVMにおけるビューモデルとは、操作とデータに対する純粋な表示を受け持つ部分である。 大雑把にいえば「UI(ビュー)を仮想化(抽象化)したもの」である。

ビューモデルは仮想のUI(ビュー)であり、たとえば"ファイルに保存する"などという「操作」をメソッド化し(コマンドと呼ばれる)、その結果は単純にメンバ変数などに反映させておくというものである。

MVCパターンにおけるビューでは、"ファイルに保存する"という動作がメインメニューとツールバー、さらにはショートカットキーの3通りもある場合には、ソースコードの書き方次第ではそれぞれに重複して似たようなメソッドが定義されることもしばしばあるが、MVVMパターンではUIを仮想化しているため動作はひとつとなる。

さらにビューモデルはビューの参照を持たず、ビューがどうなっていようと知ったことではないというのが重要な要素のひとつである。

こうすることによって単体テストが桁違いに捗ること間違いなし。

ビュー(View)[編集 | ソースを編集]

MVVMにおけるビューとは、仮想のUIであるビューモデルに肉付けを行い、実際のUIを実現する部分である。 ビューモデルから得た情報を表示したり、ビューモデルにコマンドと呼ばれる操作を送ることに特化する。

大雑把な例であるが、一切装飾をしていないHTML(ビューモデル)に、壮大なCSSで装飾しJavaScriptでゴリゴリする(ビュー)ようなものである。

MVCパターンとの決定的な違いはこのビューであり、MVCではコントローラーがモデルとビューを結び付け、以降はビューとモデルが好き勝手にやっていたが、MVVMではビューが通信できるのはビューモデルだけである。

極端に言えば、パソコン向けのUI(ビュー)とiPhone向けのUI(ビュー)が別物であっても、ビューモデルに定義される「操作」は同一にできるという話である。ただし私の知る限りではMVVMは単体テストを捗らさせる目的で使っているものばかりであり、マルチプラットフォームのために使用しているという事例は実際には見たことも聞いたこともない。

主なMVVMフレームワーク[編集 | ソースを編集]

.NET[編集 | ソースを編集]

JavaScript[編集 | ソースを編集]

関連項目[編集 | ソースを編集]

参考文献[編集 | ソースを編集]