mvvm原理
es5 object.definaproperty()
mvvm;
m改變 v檢視 vm自動重新整理
當你把乙個js裡面的object傳入vue例項的data選項中，vue會遍歷次物件中的所有property，並使用object.definaproperty把property全部轉為getter/setter object.defineproperty 是 es5 中乙個無法 shim 的特性，這也就是 vue 不支援 ie8 以及更低版本瀏覽器的原因。
這些 getter/setter 對使用者來說是不可見的，但是在內部它們讓 vue 能夠追蹤依賴，在 property 被訪問和修改時通知變更。這裡需要注意的是不同瀏覽器在控制台列印資料物件時對 getter/setter 的格式化並不同，所以建議安裝 vue-devtools 來獲取對檢查資料更加友好的使用者介面。
每個元件例項都對應乙個 watcher 例項，它會在元件渲染的過程中把「接觸」過的資料 property 記錄為依賴。之後當依賴項的 setter 觸發時，會通知 watcher，從而使它關聯的元件重新渲染。
為什麼要用vdom？
網頁載入過程
載入dom樹 —> 載入css樹—>載入render樹–>gpu渲染 圖顯示出來
網頁 操作dom 效能消耗 比較大
vue mvvm 資料變了 檢視自動重新整理
重新整理：需要有乙個 比較好的 機制 （儘量減少dom操作）
vue框架構建專案，在初次渲染時，在 dom載入完成後，生成乙個虛擬dom樹，快取起來，後面我們資料更新之後，不是直接更新dom，而是先生成乙個虛擬dom樹，跟上一次快取起來的虛擬dom進行比較（diff演算法），通過演算法比較後，得到最優（最少操作dom的方案）,根據這個方案去更新真實dom
迴圈key（每一層元素加乙個獨一無二的標誌相當於電影院座位號）: 提高 diff演算法比較虛擬dom 的 速度，提高網頁載入速度
Vue資料雙向繫結的原理
參考 vue資料雙向繫結是通過資料劫持結合發布者 訂閱者模式的方式來實現的。雙向繫結就是檢視上的變化能夠反映到資料上，資料上的變化也能反映到檢視上。如下圖所示 關鍵點在於data如何更新view，因為view更新data其實可以通過事件監聽即可，比如input標籤監聽 input 事件就可以實現了。...
vue雙向資料繫結的原理
var keyvalue 88 var obj object.defineproperty obj,key set function newvalue obj.key 88 keyvalue 99 改變keyvalue 值 obj.key 99 obj物件的key屬性已經繫結了變數keyvalue的...
vue 雙向資料繫結的原理
vue 實現雙向資料繫結的原理就是利用object.defineproperty 方法重新定義了物件獲取屬性值 get 和設定屬性值 set 的操作來實現的。簡單實現 var obj var name 引數一 定義屬性的物件 引數二 要定義或修改的屬性名稱 引數三 將被定義或修改的屬性描述符 obj...