今天看了一下vue到底是怎麼實現響應式的,發現特別簡單, 就是使用了 object.defineproperty 這個函式來進行監聽,
var vm = {};
var data =
var key , value;
for ( key in data) ,
set: function(newvalue)
})})(key)
}
第乙個引數相當於乙個vue例項,第二個引數就是data的key,第三個引數就是乙個物件,物件中包含了get和set兩個函式,分別監聽獲取和修改
在控制台獲取和修改值就會列印出get和set
Vue3 和 Vue2 的響應式原理區別
vue2響應式是通過object.defineproperty 劫持各個屬性 getter 和 setter,在資料變化時發布訊息給訂閱者,觸發相應的監聽 存在幾個問題 初始化時需要遍歷物件所有 key,如果物件層次較深,效能不好 通知更新過程需要維護大量 dep 例項和 watcher 例項,額外...
Vue3響應式原理與Vue2的對比
源資料 let person region 模擬vue2中實現響應式 let p object.defineproperties p,name 有人修改name時呼叫 set value object.defineproperties p,age 有人修改name時呼叫 set value endr...
vue2原始碼 響應式處理(學習筆記) 2
index.html檔案 一下是手寫vue的js邏輯 檔案層層下去乙個個建就好了 import from init function vue options 擴充套件原型 initmixin vue export default vue import from state export functi...