vue的dep和watcher类

98 阅读1分钟

创建一个dep和watcher类,给每一个对象的__ob__属性添加上Dep,给数组和对象也添加上Dep,简单数据类型不添加Dep(如b:10)就没有。
get收集依赖(vue2依赖是组件,由组件去更新数据),setter触发依赖 image.png

watcher的实际就是将其对象最里面的那一层遍历到输出实现响应式更新

//高阶函数,函数返回函数
function parsePath(str) {
    var segments = str.split('.') 
    return (obj) = >{
        for (let i = 0; i < segments.length; i++) {
            if (!obj) return 
            //将其属性赋值给obj实现逐层遍历到最里面的简单类型
            obj = obj[segments[i]]
        }
        return obj
    }
}
var o = parsePath('a.b.c.e') 
console.log(o)
 var o2 = o({
    a: {
        b: {
            c: {
                e: 44
            }
        }
    }
}) 
console.log(o2)//44