Vue.js雙向資料綁定實作

js中對象屬性類型有資料屬性和通路器屬性，這裡實作簡單的雙向資料綁定是利用了對象的通路器屬性中包含的get和set

修改屬性的預設特性使用Object.defineProperty()方法

addEventListener（event，function，useCapture）綁定事件，實時檢測，useCapture可選布爾值，預設為false，事件在冒泡階段執行。

事件觸發過程中，DOM事件流包含三個階段：事件捕獲，處于目标，事件冒泡

<input type="text" id="txt">
<span id="span"></span>      

var obj = {};
//為obj定義一個名字為hello的通路器屬性
Object.defineProperty(obj,"hello",{
    get:function(){
        console.log("get方法被調用了");
    },
    set:function(val){
        console.log('set方法被調用了，參數是' + val);
    }
});

obj.hello; //get方法被調用了
obj.hello = "nihao"; //set方法被調用了，參數是nihao      

var obj = {};
Object.defineProperty(obj,'hello',{
    set:function(newVal){
        document.getElementById('txt').value = newVal;
        document.getElementById('span').innerHTML = newVal;
    }
});
document.addEventListener('keyup',function(e){
    console.log(e.target);
    obj.hello = e.target.value;
},true);