Vue3 响应式系统 - 2 - Computed实现思路

1. 调度执行

可调度性是响应式系统非常重要的一个特性，所谓可调度性就是当trigger触发时 控制副作用函数的执行时机和执行次数的能力。比如连续更改data.a时，如果按照之前写的逻辑就会发现data.a改变了几次，副作用函数就触发了几次，这显然不是我们想要的结果。

data.a++

data.a++

data.a++

我们改进一下effect方法，多接收一个option对象，并挂在efectFn上方便拓展一些能力。

const effect = (fn, options = {}) => {
  const effectFn = () => {
    effectFn.deps.forEach(bucket => bucket.delete(effectFn));
    effectFn.deps = []
    effectStack.push(effectFn)

    activeFuction = effectFn
    const res = fn()
    effectStack.pop()
    activeFuction = effectStack[effectStack.length - 1]
    return res
  }
  effectFn.deps = []
  effectFn.options = options
  effectFn()
}

调用efeect方法传入option,option中有一个scheduler函数，然后在trigger方法内判断当前依赖是否有scheduler，有就执行scheduler并把当前依赖传入，否则执行依赖。

effect(() => {
  console.log(data.a)
}, {
  scheduler(fn) {
    fn()
  }
})
const trigger = (target, key) => {
  let targetMa