Object.defineProperty 和 Proxy 區別

bject.defineproperty 用於 監聽 對象的數據變化  
 
用法 Object.defineproperty(obj, key, descriptor)
 
例如： 
 
let obj = {
    age: 11
}
 
let val = 1
 
Object.defineproperty(obj, 'name', {
    get() {
        return val
    },
    set(newVal) {
        val = newVal
    }
})
 
obj.name
 
obj.name = 11
 
此外 還有以下配置項 ： 
1. configurable
2. enumerable
3. value
 
缺點： 
1.無法監聽數組變化
2.只能劫持對象的屬性,屬性值也是對象那么需要深度遍歷
 
----------------------------------------------
 
proxy  可以理解為 在被劫持的對象之前 加了一層攔截 
 
例如： 
 
let proxy = new Proxy({}, {
    get(obj, prop) {
        return obj[prop]
    },
    set(obj, prop, val) {
        obj[prop] = val
    }
})
 
proxy返回的是一個新對象， 可以通過操作返回的新的對象打到目的 
proxy有多達13種攔截方法,
get() , set() , apply() , has() , contruct() ps： 用於攔截new操作， 
deleteProperty() , defineproperty() , enumerate() , getOwnPropertyDescriptor() ,
getPrototypeOf() , isExtensible() , ownKeys() , preventExtensions() , setPrototypeOf() , 
 
 
當使用 defineProperty 時，我們修改原來的 obj 對象就可以觸發攔截

參考網站：https://blog.csdn.net/qq_42833001/article/details/83302149