Object.definePrototype

434 阅读1分钟

Object.definePrototype

给对象属性添加get,set,监听属性变化

  • 缺点
    • 监听不到新增的属性
    • 监听不到数组的方法
    • 深层嵌套属性,递归耗性能

let obj = {
    a: 1,
    b: 2,
    c: {
        d: 3
    }
}

function defineReactive(obj){

    for(let key in obj){
        defineKey(obj,key,obj[key])
    }
}

function defineKey(obj,key,val){
    if(typeof val === 'object'){
        defineReactive(val)
    }
    Object.definePrototype(obj,key,{
        configurable: true,
        enumerable: true,
        get(){
            return val;
        },
        set(newVal){
            if(typeof newVal === 'object'){
                defineReactive(newVal)
            }
            console.log('update')
            val = newVal;
        }
        
    })
    
}

obj.a = 2;
obj.b = 3;
obj.c.d = 4;