1.數據驅動
傳統的前端數據交互是用Ajax從服務端獲取數據，然后操作DOM來改變視圖；
Vue.js 是一個提供了 MVVM 風格的雙向數據綁定的 Javascript 庫，專注於View 層。它讓開發者省去了操作DOM的過程，只需要改變數據。Vue會通過Dircetives （自定義）指令，對DOM做了一層封裝，當數據發生改變會通知指令去修改對應的DOM，數據驅動DOM變化，DOM是數據的一種自然映射。Vue還會對操作進行監聽，當視圖發生改變時，vue監聽到這些變化，從而改變數據，這樣就形成了數據的雙向綁定。
MVVM 是什么 ？
MVVM 是Model-View-ViewModel 的縮寫，它是一種基於前端開發的架構模式, 本質上就是MVC 的改進版; MVVM 就是將其中的View 的狀態和行為抽象化，讓我們將視圖 UI 和業務邏輯分開。
Model:指的是數據部分，對應到前端就是javascript對象
View:指的是視圖部分，對應前端就是dom
Viewmodel: 就是連接視圖與數據的中間件或者可以說成是橋梁
數據(Model)和視圖(View)是不能直接通訊的，而是需要通過ViewModel來實現雙方的通訊。當數據變化的時候，viewModel能夠監聽到這種變化，並及時的通知view做出修改。同樣的，當頁面有事件觸發時，viewMOdel也能夠監聽到事件，並通知model進行響應。Viewmodel就相當於一個觀察者，監控着雙方的動作，並及時通知對方進行相應的操作。如下圖：
Vuejs的數據驅動實現
那么如何來實現一個類似vue的數據驅動呢 ? 詳解請點擊查看
首先，vuejs在實例化的過程中，會對遍歷傳給實例化對象選項中的data 選項，遍歷其所有屬性並使用 Object.defineProperty 把這些屬性全部轉為 getter/setter。
同時每一個實例對象都有一個watcher實例對象，他會在模板編譯的過程中,用getter去訪問data的屬性，watcher此時就會把用到的data屬性記為依賴，這樣就建立了視圖與數據之間的聯系。當之后我們渲染視圖的數據依賴發生改變（即數據的setter被調用）的時候，watcher會對比前后兩個的數值是否發生變化，然后確定是否通知視圖進行重新渲染。
這樣就實現了所謂的數據對於視圖的驅動。
2,組件化
擴展HTML元素，封裝可重用的代碼。每一個組件都對應一個ViewModel。頁面上每個獨立的可視/可交互區域都可以視為一個組件。每個組件對應一個工程目錄，組件所需要的各種資源在這個目錄下就進維護。頁面是組件的容器，組件可以嵌套自由組合形成完整的頁面。