Vue的雙向數據綁定原理是什么

　　在Vue2.x中，雙向數據綁定是通過 數據劫持 結合 發(fā)布訂閱模式的方式來實現的，也就是說數據和視圖同步，數據發(fā)生變化，視圖跟著變化，視圖變化，數據也隨之發(fā)生改變。核心：關于VUE雙向數據綁定，其核心是 Object.defineProperty()方法。

　　Vue3.x則是用ES6的語法Proxy對象來實現的。

　　Object.defineProperty()的缺點：

　　1. 只能監(jiān)聽對象(Object)，不能監(jiān)聽數組的變化，無法觸發(fā)push, pop, shift, unshift,splice, sort, reverse。

　　2. 必須遍歷對象的每個屬性

　　3. 只能劫持當前對象屬性，如果想深度劫持，必須深層遍歷嵌套的對象。

　　Proxy的優(yōu)點：

　　4. Proxy 可以直接監(jiān)聽對象而非屬性。

　　5. Proxy 可以直接監(jiān)聽數組的變化。

　　6. Proxy 有多達 13 種攔截方法,不限于 apply、ownKeys、deleteProperty、has 等等是 Object.defineProperty 不具備的。

　　7. Proxy 返回的是一個新對象,我們可以只操作新的對象達到目的,而 Object.defineProperty 只能遍歷對象屬性直接修改。

　　8. Proxy 作為新標準將受到瀏覽器廠商重點持續(xù)的性能優(yōu)化，也就是傳說中的新標準的性能紅利。

　　let arr = [];

　　let proxy = new Proxy(arr, {

　　get: function(obj, prop){

　　return obj[prop];

　　},

　　set: function(obj, prop, value){

　　obj[prop] = value; //可以被監(jiān)聽到變化

　　return true;

　　}

　　});

　　setTimeout(()=>{

　　proxy.push(1);

　　}, 2000)