SOURCE

function reactive(data){
    if(data && typeof data==='object'){
        return new Proxy(data,{
            get(target,key,receiver){
                const ret = Reflect.get(target,key,receiver)
                track(target,key)
                return Reflect.get(target,key)
            },
            set(target,key,value,receiver){
                Reflect.set(target,key,value,receiver)
                trigger(target,key)
                return true
            }
        })
    }
}

let targetMap = new WeakMap()
let activeEffect = null
function track(target,key){
    if(!targetMap.has(target))targetMap.set(target,new Map())
    let depsMap = targetMap.get(target) 
    if(!depsMap.has(key))depsMap.set(key, new Set())
    let deps = depsMap.get(key) 
    if(!deps.has(activeEffect))deps.add(activeEffect)
}

function trigger(target,key){
    const deps = targetMap.get(target).get(key)
    for(let dep of deps){
        dep && dep()
    }
}

function effect(fn){
    activeEffect = fn
    fn()
    activeEffect = null
}
const data1 = {count:0}
const res = reactive(data1)

effect(()=>{
    console.log('111',res.count)
})


effect(()=>{
    console.log('222',res.count)
})

res.count++
res.count++
res.count++
console 命令行工具 X clear

                    
>
console