vue的proxy和defineProperty區別

Object.defineProperty(obj,"name",{ set:function(val){ if(var==='lisi'){ console.log("誓死不叫這麼土的名字") }else{ objCopy.name = val } }, get:function(){ return objCopy.name.replace(/san/,'先生') } })
這個對每一個data中的屬性進行遍歷綁定。
而，

var objCopy = new Proxy(obj,{ get:function(target,key){ if(key=='name'){ return target[key].replace(/san/,'先生'); } }, set:function(target,key,value){ if(key == 'name'){ value=='lisi'?target[key]:target[key] = value; }else{ target[key] = value; } } })

get，set方法的target參數即obj對象，key參數是要操做的屬性，value參數是賦值動做時的值。
此後，可經過objCopy.name的方式訪問obj的name屬性，也能夠經過objCopy.name='lisi'的方式設置obj的name屬性，並且不用給每一個屬性都設置set,get方法，不會觸發循環調用，非常爽的。
這樣咱們經過對objCopy對象的操做就實現了對obj對象的操做，objCopy對象就是obj對象的代理對象。 vue3.0使用了Proxy替換了原先遍歷對象使用Object.defineProperty方法給屬性添加set,get訪問器的笨拙作法。

 也就是說不該遍歷了，而是直接監控data對象了。