vue的双向绑定原理

vue内部通过数据劫持&发布订阅模式实现数据的双向绑定,通过Object.defineProperty方法对所有的数据进行数据劫持,就是给这个数据动态的添加了getter与setter方法.在数据变化的时候发布消息给订阅者(Watcher)触发相应的监听回调.

let obj = {}
        let middle = 1
        Object.defineProperty(obj,'msg',{
            get(){
                
                return middle
            },
            set(val){
                
                middle = val
            }
        })
        console.log(obj.msg)   //获取对象的属性的时候,会调用自身的get方法  打印1

        obj.msg = 2   // 设置对象的属性的时候,会调用自身的set方法
        console.log(obj.msg)  //再次调用自身的 get方法   打印 2