vue數(shù)據(jù)雙向綁定是通過數(shù)據(jù)劫持結(jié)合發(fā)布者-訂閱者模式的方式來實現(xiàn)的，那么vue是如果進(jìn)行數(shù)據(jù)劫持的，我們可以先來看一下通過控制臺輸出一個定義在vue初始化數(shù)據(jù)上的對象是個什么東西。
代碼部分：
var vm = new Vue({
? ? data: {
? ? ? ? obj: {
? ? ? ? ? ? a: 1
? ? ? ? }
? ? },
? ? created: function () {
? ? ? ? console.log(this.obj);
? ? }
});
輸出結(jié)果：
我們可以看到屬性a有兩個相對應(yīng)的get和set方法，為什么會多出這兩個方法呢？因為vue是通過Object.defineProperty()來實現(xiàn)數(shù)據(jù)劫持的。
Object.defineProperty() 方法會直接在一個對象上定義一個新屬性，或者修改一個對象的現(xiàn)有屬性， 并返回這個對象。
語法：Object.defineProperty(obj, prop, descriptor)
obj：要在其上定義屬性的對象。
prop：要定義或修改的屬性的名稱。
descriptor：將被定義或修改的屬性描述符。
get：一個給屬性提供 getter 的方法，如果沒有 getter 則為 undefined。當(dāng)訪問該屬性時，該方法會被執(zhí)行，方法執(zhí)行時沒有參數(shù)傳入，但是會傳入this對象（由于繼承關(guān)系，這里的this并不一定是定義該屬性的對象）。
默認(rèn)為 undefined。
set：一個給屬性提供 setter 的方法，如果沒有 setter 則為 undefined。當(dāng)屬性值修改時，觸發(fā)執(zhí)行該方法。該方法將接受唯一參數(shù)，即該屬性新的參數(shù)值。
默認(rèn)為 undefined。
Object.defineProperty( )是用來做什么的？它可以來控制一個對象屬性的一些特有操作，比如讀寫權(quán)、是否可以枚舉，這里我們主要先來研究下它對應(yīng)的兩個描述屬性get和set，如果還不熟悉其用法，了解更多請點擊
實現(xiàn)mvvm主要包含兩個方面，數(shù)據(jù)變化更新視圖，視圖變化更新數(shù)據(jù)：
關(guān)鍵點在于data如何更新view，因為view更新data其實可以通過事件監(jiān)聽即可，比如input標(biāo)簽監(jiān)聽 'input' 事件就可以實現(xiàn)了。所以我們著重來分析下，當(dāng)數(shù)據(jù)改變，如何更新視圖的。
數(shù)據(jù)更新視圖的重點是如何知道數(shù)據(jù)變了，只要知道數(shù)據(jù)變了，那么接下去的事都好處理。如何知道數(shù)據(jù)變了，其實上文我們已經(jīng)給出答案了，就是通過Object.defineProperty( )對屬性設(shè)置一個set函數(shù)，當(dāng)數(shù)據(jù)改變了就會來觸發(fā)這個函數(shù)，所以我們只要將一些需要更新的方法放在這里面就可以實現(xiàn)data更新view了。
接下來的是實現(xiàn)過程，放個傳送門有興趣的可以看一下哦傳送門
一起加油?。?！
