vue2.x和vue3.x实现双向绑定的不同方式

vue2.x

在vue2.x中，实现双向绑定，是使用Object.defineProperty()方法对属性设置get和set方法实现。
Object.defineProperty()

let obj = {};
Object.defineProperty(obj,'name',{
       get(){
          //读取
          console.log('get被调用了');
       },
       // set自带一个参数
       set(value){
          //写入
          console.log('set被调用了');
       }

})
obj.name = "翠花";//调用了set
console.log(obj.name);//调用了get

在vue3.x中，是使用es6中的proxy对象。
ES6-proxy

 let obj = {}
 //代理obj对象
 let proxyObj= new Proxy(obj,{
 get:function(obj,prop){
       //obj :被代理的对象 prop:要操作的属性
       console.log('get被调用了');
       return obj[prop];
 },
 set:function(obj,prop,value){
       // obj:被代理的对象
       // prop要赋值的属性
       // value要赋值的结果
       console.log('set被调用了');
       // 将赋值的结果保存起来
       obj[prop] = value;
       }
 })