nextTick原理

1、
Vue是异步更新dom的，只要侦听到数据变化，Vue将开启一个对列，缓冲在同一事件循环中更新变化的数据
2、
同一个watcher被触发多次之后，只会被推入队列一次
3、
Vue考虑到兼容性问题，有一个降级处理，目的是将flushCallBack函数放到微任务或者宏观任务当中
4、
尝试使用Promise.then、MutationObserve和setImmediate，上述三个都不支持最后使用setTimeout
5、
nextTick如果没有传出callback，则返回new Promise，所以nextTick不传入函数，后面可以连接then
6、
flushCallvacks中复制了callbacks并把它置空，循环调用赋值出来的数组的每个函数
7、queueWatcher

a、对watcher进行列队处理的函数
b、三个重要变量

• flushing：调度列队状态，列队是否在循环过程中

• waiting：调度器的状态，是否处于等待（非空闲）状态，true说明等待中（非空闲），false说明执行完成（空闲中）

• has：是一个对象，key为watcher的id

c、解读：

• 先判断下是否列队中已经存在当前的wather 不存在则把has[watcher.id]置为true

• 是否在循环过程中？不再循环过程中直接塞进去；在循环过程中，则插进去，插入的位置为正在执行的watcher的后面

• 如果空闲状态，则把waitting置为true，非空闲状态；同时执行

c、flushSchedulerQueue；

最后会执行的函数
解读：

• 把调度队列状态置为true

• 对队列进行排序，id越小的watcher排的越靠前，也就是越早创建的watcher，排的越靠前

• 对队列进行循环，berfore调用和run调用，同时把has[watcher.id]置为null

• 对activeChildren和queue进行复制

• 调用resetSchedulerState，把队列和队列状态以及调度器状态置为初始状态

• 调用active和update钩子函数

• 浏览器针对Vue开发工具进行更新操作