分支切换的定义定义
-
- effectFn 函数内部存在一个三元表达式，根据字段 obj.ok值的不同会执行不同的代码分支
- 当字段 obj.ok 的值发生变化时，代码执行的分支会跟着变化
分支切换的副作用
- 分支切换会产生遗留的副作用函数，拿上面这段代码举例
-
- 字段 obj.ok 的初始值为 true，这时会读取字段 obj.text 的值，所以当 effectFn 函数执行时会触发字段 obj.ok 和字段 obj.text这两个属性的读取操作
- 时副作用函数 effectFn 与响应式数据之间建立的联系如下
- 理想情况下副作用函数与响应式数据之间的联系
-
- 副作用函数 effectFn 分别被字段 data.ok 和字段data.text 所对应的依赖集合收集
- 当字段 obj.ok 的值修改为false，并触发副作用函数重新执行后
- 此时字段 obj.text 不会被读取，只会触发字段 obj.ok 的读取操作
- 理想情况下副作用函数 effectFn 不应该被字段 obj.text 所对应的依赖集合收集
断开副作用函数与响应式数据之间的联系
实现思路
- 每次副作用函数执行前，将其从相关联的依赖集合中移除，那么问题就迎刃而解了
代码实现
-
- 在 effect 内部我们定义了新的 effectFn函数
- 为其添加了 effectFn.deps 属性
- 该属性是一个数组，用来存储所有包含当前副作用函数的依赖集合
- 在track函数中实现 effectFn.deps数组中的依赖收集
-
- 在 track 函数中将当前执行的副作用函数activeEffect 添加到依赖集合 deps 中
- deps 就是一个与当前副作用函数存在联系的依赖集合
- 把它添加到activeEffect.deps 数组中，这样就完成了对依赖集合的收集
- 根据effectFn.deps 获取所有相关联的依赖集合，进而将副作用函数从依赖集合中移除
- cleanup 函数的实现
-
- cleanup 函数接收副作用函数作为参数
- 遍历副作用函数的effectFn.deps 数组
- 该数组的每一项都是一个依赖集合
- 将该副作用函数从依赖集合中移除
- 重置 effectFn.deps 数组
- 新构造 effectsToRun 集合并遍历它，代替直接遍历 effects 集合，避免了无限执行
