[Vue] 源码学习-mini-observer实现

思否格式用不习惯，可以移步语雀
https://www.yuque.com/diracke...

目标是构建observe 和 autorun 函数，使得在observe和autorun执行后，state.count改变时，自动触发console.log。

核心实现步骤有两个：

第一是利用Object.defineProperty()，为对象中的每一个属性 （此处的state）设置getter和setter方法，这个不难理解。代码如下。

第二是利用autorun函数，以及一个Dep类，实现需要被监听的属性的收集。实例中的箭头函数中调用dep.depend()方法，这里也是关键点，有这个调用，activeUpdate保存的wrappedUpdate实例才能被存入subscribers列表中。
而后在dep.notify()调用时，执行subscribers中的每一个wrappedUpdate。

实现如下：

上面两个核心步骤做完之后，只需要对observe函数稍加变动

在getter的时候触发dep.depend() 将wrappedUpdate实例存入subscribers列表中。
在setter的时候触发dep.notify() 让subscribers中的每一个wrappedUpdate再执行一次。

autorun中的console.log(state.count) 触发了getter。（这个很重要，getter中的dep.depend()执行）
后文的state.count++触发setter。