差分

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

==利点と欠点 = MVVMの構造 ====利点 = モデル（Model） ==モデルはアプリケーションのデータを格納する部分。ビジネスドメインの操作と[[データ]]からなる* UIを仮想化するので[[オブジェクト単体テスト]]で、UIからは独立している。がしやすい

=== 欠点 ===* [[MVCハローワールド]]パターンのモデルと同じもの。すら[[ソースコード]]が壮大になる** プログラマーやデザイナーの学習コストが大きい** [[ソースコード]]の量に比例して[[バグ]]の量も増える。ただし[[バグ]]は潰しやすい。

== ビューモデル（ViewModel） = 総評 ===ビューモデルは操作とデータに対する純粋な表示を受け持つ。[[ITドカタ]]たちが高層ビルのような壮大な[[システム]]を建造する際の技法であり、[[日曜プログラマー]]が犬小屋のような小物アプリを作る際に使うような代物ではない。まさに適材適所であり、小物であれば[[MVC]]の方がいいです。

ここで注意しなければならないのはビューモデルはUI自体ではないという点。たとえばビューモデルはボタンやスタイルなどの視覚的な機能を持たない。あくまでUIを抽象化したものである。さらにビューモデルはビューの参照を持たない。== MVVMの構造 ===== モデル（Model） ===MVVMにおけるモデルとは、[[単体テストビジネスロジック]]がよりいっそう捗る。を記述する部分である。いわゆる[[MVC]]パターンのモデルと同じものである。

=== ビューモデル（ViewModel） ===MVVMにおけるビューモデルとは、操作と[[データ]]に対する純粋な表示を受け持つ部分である。大雑把にいえば「UI（ビュー）を仮想化（抽象化）したもの」である。 ビューモデルは仮想のUI（ビュー）であり、たとえば"ファイルに保存する"などという「操作」をメソッド化し（コマンドと呼ばれる）、その結果は単純にメンバ変数などに反映させておくというものである。 MVCパターンにおけるビューでは、"ファイルに保存する"という動作がメインメニューとツールバー、さらにはショートカットキーの3通りもある場合には、[[ソースコード]]の書き方次第ではそれぞれに重複して似たようなメソッドが定義されることもしばしばあるが、MVVMパターンではUIを仮想化しているため動作はひとつとなる。 さらにビューモデルはビューの参照を持たず、ビューがどうなっていようと知ったことではないというのが重要な要素のひとつである。 こうすることによって[[単体テスト]]が桁違いに捗ること間違いなし。 === ビュー（View） ===MVVMにおけるビューとは、仮想のUIであるビューモデルに肉付けを行い、実際のUIを実現する部分である。ビューモデルから得た情報を表示したり、ビューモデルにコマンドと呼ばれる操作を送ることに特化する。 大雑把な例であるが、一切装飾をしていない[[HTML]]（ビューモデル）に、壮大な[[CSS]]で装飾し[[JavaScript]]でゴリゴリする（ビュー）ようなものである。 [[MVC]]パターンとの決定的な違いはこのビューであり、MVCではコントローラーがモデルとビューを結び付け、以降はビューとモデルが好き勝手にやっていたが、MVVMではビューが通信できるのはビューモデルだけである。例えるなら、MVCは直球な出会い系サイトで、MVVMは監視人がいて建前上は出会い系サイトではないSNSゲームサイトといったところか。パターンとの決定的な違いはこのビューであり、MVCではコントローラーがモデルとビューを結び付け、以降はビューとモデルが好き勝手にやっていたが、MVVMではビューが通信できるのはビューモデルだけである。 極端に言えば、[[パソコン]]向けのUI（ビュー）と[[iPhone]]向けのUI（ビュー）が別物であっても、ビューモデルに定義される「操作」は同一にできるという話である。ただし私の知る限りではMVVMは単体テストを捗らさせる目的で使っているものばかりであり、マルチプラットフォームのために使用しているという事例は実際には見たことも聞いたこともない。 ==主なMVVMフレームワーク=====.NET===*[[WPF]]*:実質的に[[Windows]]でしか使えない。[[デバッグ]]が容易になるが[[コード]]量が増えるので相殺され意味なし。*[[MvvmCross]]*:定番。[[NuGet]]が用意されてなくて若干不便。*[[ReactiveUI]]*:知らん。*[[ReactiveProperty]]*:知らん。日本製らしいが[[Xamarin.Forms]]ネタばかりで[[Xamarin.iOS]]での使い方がわからなかったので30分で諦めた。===JavaScript===* [[knockout.js]]

* [[デザイン・パターン]]** [[Model View Controller]]** [[Model View ViewModel]]