watcher的handler中是如何获取到oldVal的?

watcher的handler中是如何获取到oldVal的?为什么在deep:true的情况下,Object引用类型的newVal和oldVal是一样的?

阅读 1.9k
3 个回答

v2的watcher实例是有一个value属性存储前一次的值,新的值是通过调用getter获取的,所以可以拿到旧值。

引用类型因为你并没有给它赋新值,所以它指向的是内存中的同一个对象,打印出来的也是同一个对象,如果你修改了这个对象上某个属性的值,可以直接将这个属性值打印来查看。

如果是 V2 的话,因为响应式原理就是通过 Object.defineProperty 把这些 property 全部转为 getter/setter
所以在每次修改变量的时候(set),就去回去触发 watch,所以可以同时拿到新值和旧值。所以并不是说,变量值变更之后 watch 才会知道。

还没看过 V3 的源码,估计也是差不多,只不过 V3 通过 Proxy 去代替了原本的 getter/setter


然后来说第二个问题,如果 object 类型的你在通过 console.log 打印的时候会因为快照的关系只有第一层才会是你打印时的状态(不是必定),所以会出现在我们查看的时候前后值相同的情况。

一般我们在对比数据的时候如果层级比较深的属性,最好是直接打印想要看的具体的属性值。
比如说 console.log(a.b.c.d.e.f.g) 这样,保证最后输出的时候是一个固定的快照。

另外一个就是如果某一个属性值为引用类型的情况下,因为他只是引用具体指向的是一块内存地址,所以后来新值覆盖的时候,你看的就会是新赋值的数据。

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题
宣传栏