js实现数据双向绑定

我们主要通过ES5中的Object.defineProperty实现，主要是利用里面的get和set来实现数据双向绑定

Object.defineProperty()方法会直接在一个对象上定义一个新属性，或者修改一个对象的现有属性，并返回此对象。

注:应当直接在 Object 构造器对象上调用此方法，而不是在任意一个 Object 类型的实例上调用。

以上没满足知识量的可查看详情 :双向绑定原理详情

//布局
<div id="dome"></div>
<input type="text" id="inp">
//js
var obj={}
var inp=document.getElementById('inp')
var dome=document.getElementById('dome')
Object.defineProperty(obj,'name',{
    get:function(val){
        return obj
     },
    set:function(val){ //该属性被赋值的时候触发
        inp.value=val
        dome.innerHTML=val//页面显示
    }
 })
inp.addEventListener('input',function(e){//输入框触发input事件给obj的name赋值
    obj.name=e.target.value
 },false)
obj.name='sss'//默认值
console.log(obj.name);

以上就是对ES5中Object.defineProperty实现双向数据绑定的理解