好程序員web前端分享MVVM框架Vue實現原理，Vue.js是當下很火的一個JavaScript MVVM庫，它是以數據驅動和組件化的思想構建的。相比于Angular.js和react.js更加簡潔、更易于理解的API，使得我們能夠快速地上手并使用Vue.js。

?

1.什么是MVVM呢？

MVVM的簡寫是Model-View-ViewModel。

　　在過去的10年里面，我們已經把很多傳統的服務端代碼放到了瀏覽器中，這樣就產生了成千上萬行的javascript代碼，它們連接了HTML 和CSS文件，但缺乏正規的組織形式，這也就是為什么很多開發者使用框架。比如：angular.js、react.js、vue.js。有了這些框架之后，瀏覽器的兼容性問題已經不再是我們前端開發的阻礙。（這里應該有歡呼聲，為什么要這么說，下次寫瀏覽器兼容時再告訴你們）前端的項目體積不斷的在加大，從一個簡陋的小小的頁面變成炫彩的頁面需要成千上萬的代碼，這樣導致了項目的可維護性和擴展性包括重要的安全性等成了最主要問題。

　　這也是為什么有很多很多的開發人員使用框架，框架簡潔，有API。在當年那個時代為了解決瀏覽器兼容性問題，出現了很多類庫，其中最典型的就是JQuery。但是這類庫沒有實現對業務邏輯的分成，所以維護性和擴展性極差。綜上兩方面原因，才有了MVVM模式一類框架的出現。比如說vue.js框架就是通過數據的雙向綁定，極大了提高了開發效率。

1. MVVM框架

Vue就是基于MVVM模式實現的一套框架，在vue框架中：

Model:指的是js中的數據，如對象，數組等等。

View:指的是頁面視圖

viewModel:指的是vue實例化對象，

　　都說Vue.js是一個漸進式的javascript框架, 漸進式是什么意思？

1. 　　假如你已經有一個現成的服務端應用，你可以將vue 作為該應用的一部分加入其中，帶來更好的交互體驗;
2. 　　假如你想將更多的業務邏輯放到界面來實現，那么Vue可以滿足你大部分的需求，（vue2.x+vue-router+axios+webpack）。和其它前端框架一樣，VUE的優點在于可以很好的每一個功能、特效變成組件化，有更好的可維護性，也可以進行復用，每個組件都包含屬于自己的HTML、CSS、JAVASCRIPT以用來渲染網頁中相應的地方
3. 如果我們構建一個大型的應用，在這一點上，vue有一個命令行工具，使快速初始化一個真實的工程變得非常簡單（vue init webpack my-project）。我們可以使用VUE的單文件組件，它包含了各自的html、JavaScript以及帶作用域的css或scss。

以上這三個例子，是一步步遞進的，也就是說對Vue.js的使用可大可小，它都會有相應的方式來整合到你的項目中。所以說它是一個漸進式的框架。Vue.js最獨特的特性：當我們的數據變更時，Vue.js會幫你更新所有網頁中用到它的地方。