Vue源码的解读

源码解读的入口：

　　/src/core/instance/index.js

　　这里主要做了一件事情就是调用Vue.prototy._init()

然后到了：

　　/src/core/instance/index.js

　　1、 这里做了 初始化Vue 还有增加各个vue实例对象（每个一个vue文件就是一个实例对象），然后把vue的组件各个合并起来。

　　2、组织组件之间的关系。initLifecycle(vm)

　　3、然后初始化各个组件上面的事件。

　　4、绚烂vm.$slot。

　　5、beforecreate

　　6、初始化inject，这个功能因为开发底层库，没有vuex进行状态管理，所以是用这个和provide来结合使用。

　　7、响应式。

　　8、provide。

　　9、created。

　　10、挂载。

 

响应式。

　　1、先是走props，这个先挂载到vm上面去。这个如何判断值不能被修改的？

　　2、在methods，先判断是否与props上面的命名冲突，然后挂载。

　　3、data的挂载，也是先判断是否与之前两个的冲突。这个还涉及到了observe 观察把里面的值放进去观察。

　　4、computd，因为这个他下面的有两种形式，一种是函数，就相当于有一个get方法。如果是对象，是有一个get和set的方法。这个是与watcher结合，当执行后会把watcher.dirty改成false，这样下次使用就不会再执行直接拿watcher.value的值，只有在页面改变触发了updata，才把dirty改成true。才再次执行computed的。它直接是懒执行写死了。明天看下懒执行写在哪里?一般处理的是同步。

　　5、watch，watch的写法特别的多，详情可以看官网，这里我就认识到了三种，第一种是函数就是直接变成了handle，如果是对象，需要在下面写一个handle函数，第三种就是字符串的形式，这个函数是写在methods下面。它不是懒执行，是可以改成立即执行的。一般处理的是异步。

　　6、明天还需要再看看这一部分，主要是有一个observe函数和一个Observe对象，这里对象有点处理data下面是一个对象还是数组。数组响应式就是数组的7个方法，对象的话只是监听已有的属性。判断是使用isArrer。然后这里还有一个dep和watcher 进行互相的收集，dep相当于所有的watcher的集合，因为这个dep是watcher的集合，然后我们又要观察每一个dep，每个一个对象一个dep，发生变化是再object.defineProporty下面的一个set方法。dep.notify()来通知数据发现了变化，再get中是收集哪些需要被监听，在set中是监听 发现了变化进行通知，做出updata进更新，把更新的值也放到监听器中去。

 

vue的异步执行机制：

　　dep.notify() 通知watcher进行 updata的更新，因为更新的会很多需要一个个的更新，所以就放到了一个队列当中去，是一个个的进去里面有一个wating判断按顺序的进入，最关键的是有nextTrick()函数。nextTrick函数会分装下 flushSchedulerQueue函数 这个函数是用来执行watcher.run 和 执行

callUpdatedHooks来进行刷新队列。因为nextTrick函数最终是需要执行flushSchedulerQueue函数的，把flushSchedulerQueue封装完后放到了

flushCallbacks函数中，因为每次只能执行一个watcher.run 所以需要pending来限制住，然后根据timeFunc 来限制住异步，这个是最为关键的一步，这个异步有4个异步。首先promise的.then，然后MutationObserver这个两个是微任务，然后到了setImmediate、最后是setTimeout函数来执行flushCallbacks->flushSchedulerQueue->watcher.run和callUpdatedHooks->watcher.get