Model View ViewModel

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

勉強中。

MVVMの構造

モデル（Model）

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

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

ビューモデル（ViewModel）

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

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

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

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

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

ビュー（View）

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

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

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

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

関連項目

• デザイン・パターン
  • Model View Controller
  • Model View ViewModel

主なMVVMフレームワーク

• WPF
• knockout.js