在看Vue的源码,产生一个疑问:
在 state.js 的 initData()
函数中,使用的是 observe()
方法来为数据对象绑定一个Observer对象,Observer对象执行 defineReactive()
方法为数据对象设置 setter 和 getter。
而在 initProps()
函数中,通过遍历 props
选项直接对数据执行了 defineReactive()
方法来设置 setter 和 getter。
那么,同样是为数据设置 setter 和 getter,为什么 initData()
比 initProps()
多一个 Observer 类,这个 Observer 类的功能到底是什么?
简单看了一下,抛个砖
站在component的角度,props是immutable的,而data是mutable的
所以相对于props,data需要对对象的子对象以及数组内的元素都设置setter 和 getter
而props不用
所以Observer的功能,应该就是对数组元素的遍历执行
defineReactive()
,以及深度遍历Object为每一个子对象都执行defineReactive()
对应的就是
Observer.observeArray
和Observer.walk
这两个方法可能还有一些细节上的差别,但主要的应该就这两点了