携手创作,共同成长!这是我参与「掘金日新计划 · 8 月更文挑战」的第23天,点击查看活动详情
上一篇讲完forEach,这种叫遍历,在Map里还有另一类特殊的API叫迭代器,比如说entries.我们可以通过for ... of或者手动直接调用.
这就是Map迭代器的基本使用了,现在我们试着去响应一下。首先我们先试一下我们之前的代码,直接创建一个响应式的Map,然后尝试去迭代它,很显然会直接报错
现在我们新增一下代码,增加当前的迭代器。
这时候,我们发现了跟上一章forEach的一样的问题,迭代出来的值不再是响应式的,它只是原始值。这肯定与我们的初衷不符,我们肯定希望迭代出来的值也是响应的。
根据上一篇,我们重新实现一下迭代器,并把原始值再次转换成响应式。
我们重新实现一下,迭代器中的
next方法,首先调用一下本身迭代器的next方法,然后判断值是否存在,如果存在就转换为响应式。
这样我们直接for ... of的时候,其实就会调用这个next方法。
其实在这里有一个小tips,我们在
wrap的时候,虽然新返回了一个响应式变量,但之前我们的reactive函数中其实是有缓存了,这样就保证了之前的副作用函数与没有消失,作者还是很严谨的。
但是仅这样,还不够,我们还需要追踪依赖,这里依然需要让副作用函数与ITERATE_KEY建立关联,这块就不抄书上的代码,之前已经写过N次了