閑來無事看到了一個關於Vue的MVVM的簡單講解，覺得寫得不錯，做個分享。
文章地址
文章內容我就不貼出，比較簡潔明了，我記錄一下我的一些思考總結。
PS：建議先仔細讀這篇文章。
MVVM
MVVM即雙向數據綁定，是一種設計模式，一般是Web前端框架的核心概念，肯定也不是Vue只此一家有。
簡單來說就是，數據跟視圖的實時綁定。如果我們自己要實現這個需求，那核心的問題有三個：
1、如何監聽到數據變化？
2、數據變化如何通知到視圖？
3、視圖如何更新？
這三個問題先放着，后面大家就知道我為什么這么划分這三個問題。
討論文章
實現數據綁定的做法有大致如下幾種：1、發布者-訂閱者模式（backbone.js）2、臟值檢查（angular.js）3、數據劫持（vue.js）
那文章中把實現數據綁定歸類為這幾種，不過我覺得他的說法有問題。
首先，發布訂閱模式是一種消息通知的設計模式，它解決的是通知的問題，也就是我上面提到的第2個問題。
然后，無論是臟值檢查還是數據劫持，它解決的是監聽數據變化的問題，也即是上面第1個問題。
也就是說，實現數據綁定，做法是 2 或 3 + 1，而不是選擇其中一個就可以的。
另外，這三個方式並沒有視圖更新的部分，不能算是一個完整的數據綁定過程。
PS：這一點上大家要明確。
如何監聽到數據變化？
angular.js：臟值檢查。
vue.js：數據劫持。
angular.js我已許久不用，就不多討論，這里談談vue.js。
不得不說，vue.js是做得比較雞賊的，它利用js的語言特性，即Object.defineProperty()方法，做到了監聽數據變化，但也因此它只能兼容IE9以上瀏覽器。
框架所使用的語言特性，直接影響它的兼容性。
數據變化如何通知到視圖？
如果對設計模式比較了解，一看到這個需求，很自然而然地就想起訂閱發布模式。
關於訂閱發布模式，可查看：https://www.cnblogs.com/lovesong/p/5272752.html
視圖如何更新？
在看那文章中，我最感興趣的是這個，有些豁然開朗。
在我看來，視圖更新數據無非是在元素節點的屬性或內容上，那么只需要設置一些特殊的指令作識別，再將相應的數據更新到元素上即可。
這樣這一步需要做兩件事：
1、指令解析器。解析指令，例如指令類型、對應表達式或數據項。
2、訂閱事件。根據數據項生成訂閱者。
做到這兩步，再加上前面所做，就完成了MV的綁定。這個過程中，數據的維護方是觀察者，而指令解析器是訂閱者。
可能大家沒有意識到的是，如果要完成VM的綁定，那么指令解析器是觀察者，而數據的維護方是訂閱者。例如一個表單的input，指令解析器解析出v-model時，它就需要監聽input的change事件，當數值變化時，它需要通知數據維護方更新數據。
所以，在完整的MVVM中，數據維護方和指令解析器即是觀察者，也是訂閱者。
總結
MVVM，無論細節是如何實現，其關鍵部分就在於訂閱發布這種思想，把握好這個，理解就不難了。