es6的set和get實現數據雙向綁定，監聽變量變化。

直接上代碼吧，這個用法真的是效仿了.net的枚舉。

vue的數據雙向綁定就是用這個實現的。

代碼：

　　

html:
    <input type="text" id="input1">
    <input type="text" id="input2">
    我每次比input1的值加1=>
    <span id="span"></span>

js:
var oInput1 = document.getElementById('input1');
    var oInput2 = document.getElementById('input2');
    var oSpan = document.getElementById('span');
    var obj = {};
    Object.defineProperties(obj, {
        val1: {
            configurable: true,
            get: function() {
                oInput1.value = 0;
                oInput2.value = 0;
                oSpan.innerHTML = 0;
                return 0
            },
            set: function(newValue) {
                oInput2.value = newValue;
                oSpan.innerHTML = Number(newValue) ? Number(newValue) : 0
            }
        },
        val2: {
            configurable: true,
            get: function() {
                oInput1.value = 0;
                oInput2.value = 0;
                oSpan.innerHTML = 0;
                return 0
            },
            set: function(newValue) {
                oInput1.value = newValue;
                oSpan.innerHTML = Number(newValue)+1;
            }
        }
    })
    oInput1.value = obj.val1;
    oInput1.addEventListener('keyup', function() {
        obj.val1 = oInput1.value;
    }, false);
    oInput2.addEventListener('keyup', function() {
        obj.val2 = oInput2.value;
    }, false);

　　

監聽變量值變化，數據雙向綁定：

　　

html:
    <button onclick="plus()">  +  </button>
    <p id="p">0</p>
js:
    function plus() {
        watchVal.val = ++watchVal.value;
        var screen = document.getElementById('p');
        var text='00';
        text=watchVal.value;
        screen.innerHTML = text;
        console.log(watchVal.value)
    }
    var watchVal = {
        value: 0,
        get val() {
            console.log('取值', this.value);
            return this.value;
        },
        set val(vals) {
            this.value = vals;
            console.log('存過后的值', this.value);
        }
    }

　　

【未完待續，后續我封裝一個自己的插件哦~】