vue2.0数据劫持

针对 Object 类型的劫持

对于 Object 类型，主要劫持其属性的读取与设置操作。在 JavaScript 中对象的属性主要由一个字符串类型的“名称”以及一个“属性描述符”组成，属性描述符包括以下选项：
value： 该属性的值；
writable： 仅当值为 true 时表示该属性可以被改变；
get： getter （读取器）；
set： setter （设置器）；
configurable： 仅当值为 true 时，该属性可以被删除以及属性描述符可以被改变；
enumerable： 仅当值为 true 时，该属性可以被枚举。

废话少说，开干！！！
html部分:

<input type="text" id="input_1">

<span id="span_1"></span>

js部分:

var obj = {};
Object.defineProperty(obj, 'name', {
　　set: (newVal)=>{
　　　　document.getElementById('input_1').value = newVal;
　　　　document.getElementById('span_1').innerHTML = newVal;
　　}
});
//绑定事件直接render dom中
document.addEventListener('keyup', (e)=>{
    // console.log(e.target.value)
　　obj.name = e.target.value;
})