「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]]で装飾し[[JavaScript]]でゴリゴリする（ビュー）ようなものである。

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

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

== 関連項目 ==
* [[デザイン・パターン]]
** [[Model View Controller]]
** [[Model View ViewModel]]

; 主なMVVMフレームワーク
* [[WPF]]
* [[knockout.js]]

== 参考文献 ==
{{reflist}}

== 外部リンク ==

{{stub}}