继续上文。。。flushBatchedUpdates 的源码

var flushBatchedUpdates = function () {
  // ReactUpdatesFlushTransaction's wrappers will clear the dirtyComponents
  // array and perform any updates enqueued by mount-ready handlers (i.e.,
  // componentDidUpdate) but we need to check here too in order to catch
  // updates enqueued by setState callbacks and asap calls.
  while (dirtyComponents.length || asapEnqueued) {
    if (dirtyComponents.length) {
      var transaction = ReactUpdatesFlushTransaction.getPooled();
      transaction.perform(runBatchedUpdates, null, transaction);
      ReactUpdatesFlushTransaction.release(transaction);
    }
    if (asapEnqueued) {
      asapEnqueued = false;
      var queue = asapCallbackQueue;
      asapCallbackQueue = CallbackQueue.getPooled();
      queue.notifyAll();
      CallbackQueue.release(queue);
    }
  }
};

      在此又出现了一个新的事物ReactUpdatesFlushTransaction，它主要用来捕获在运行flushBatchedUpdate后将要运行的updates。这个过程比较复杂，因为componentDidUpdate或则setState后的回调方法需要进入下一个更新队列。另外这个事物是getpooled来的，而不是实时创建的，这样做的好处是避免不必要的垃圾收集。另外这个地方也涉及到asp update的内容，后续将介绍到。
      在上述源码中，需要在ReactUpdatesFlushTransaction事物的输入参数中调用了runBatchedUpdates，我们来看一看这个方法的逻辑功能：

function runBatchedUpdates(transaction) {
  var len = transaction.dirtyComponentsLength;
//父组件通常比子组件有更高的reconcile等级，所以需要对dirtyComponents进行排序
  dirtyComponents.sort(mountOrderComparator);
   // reconciling时任何更新队列在整个批量处理后必须执行。然而，假设dirtyComponents是[A，B]，B和C是A的child如果C的渲染器为B进行入队列更新，那么在一次批量处理中B需要更新两次。由于B已经更新了，我们将会忽略它，再次更新它的方式只能通过检查bact的数量
  updateBatchNumber++;
  for (var i = 0; i < len; i++) {
    var component = dirtyComponents[i];
   //如果，在任何新的更新队列中发生了performUpdateIfNecessary，那么只能在下一次发生渲染时执行回调所以，先将回调存储下来。（后面来看一看什么是performUpdateIfNecessary）
    var callbacks = component._pendingCallbacks;
    component._pendingCallbacks = null;
    var markerName;
    if (ReactFeatureFlags.logTopLevelRenders) {
      var namedComponent = component;
      // Duck type TopLevelWrapper. This is probably always true.
      if (component._currentElement.type.isReactTopLevelWrapper) {
        namedComponent = component._renderedComponent;
      }
      markerName = 'React update: ' + namedComponent.getName();
      console.time(markerName);
    }
    ReactReconciler.performUpdateIfNecessary(component, transaction.reconcileTransaction, updateBatchNumber);
    if (markerName) {
      console.timeEnd(markerName);
    }
  // 将回调函数放入transaction的回调队列中
    if (callbacks) {
      for (var j = 0; j < callbacks.length; j++) {
        transaction.callbackQueue.enqueue(callbacks[j], component.getPublicInstance());
      }
    }
  }
}

      这个方法遍历所有的dirtyComponent，并根据渲染的顺序对它们进行排序，比如从父节点到子节点的开始更新。运行来自ReactReconciler对象下的performUpdateIfNecessary方法，并将回调函数放入transaction队列中。（修正：runBatchedUpdates的逻辑功能是先排序保证先渲染父组件再渲染子组件，再执行必要的更新，最后将回调函数写入callbackQueue。
现在到最后一步了ReactReconciler
2-3 ReactReconciler&performUpdateIfNecessary
      因为，internalInstance是ReactCompositeComponentWrapper实例，它的prototype继承了ReactCompositeComponent.Mixin，所以可以在ReactCompositeComponent下找到performUpdateIfNecessary这个方法，来看一看它的源码：

performUpdateIfNecessary: function (internalInstance, transaction, updateBatchNumber) {
    // 组件的批量处理个数应该和当前或者接下来的批量处理个数相同
    if (internalInstance._updateBatchNumber !== updateBatchNumber) {
      return;
    }
    …
    internalInstance.performUpdateIfNecessary(transaction);
   …
  }
};

ReactCompositeComponent文件下找到performUpdateIfNecessary 方法：

  /**
   * If any of `_pendingElement`, `_pendingStateQueue`, or `_pendingForceUpdate`
   * is set, update the component.
   *
   * @param {ReactReconcileTransaction} transaction
   * @internal
   */
  performUpdateIfNecessary: function (transaction) {
    if (this._pendingElement != null) {
      ReactReconciler.receiveComponent(
this,
this._pendingElement, 
transaction, 
this._context);
    } 
else if (this._pendingStateQueue !== null || this._pendingForceUpdate) 
{
     this.updateComponent(transaction, 
this._currentElement, 
this._currentElement,
 this._context, this._context);
    } else {
      this._updateBatchNumber = null;
    }
  }

这个方法被分成了两个部分：
      （1） ReactReconciler.receiveComponent是用来在element级别中比较Component，所以element实例被比较后，如果component和element实例不同或者内容发生了变化，那么将会调用内部实例的receiveComponent方法。如果组件相同时，会调用updateComponent方法，这个方法包含了检测逻辑功能。
      （2） updateComponent 如果存在pending state，将会调用这个方法
你可能会思考，为什么需要检测pending状态或者强迫更新，由于调用了setState，所以state处于pending状态？其实不是这样的。真正的原因是updateComponent是递归地更新的组件，但pending state是空的。而且，对_pendingElement的检查是用于处理children被更新的场景。下面来看一看updateComponent的具体实现方法：

updateComponent: function (transaction, prevParentElement, nextParentElement, prevUnmaskedContext, nextUnmaskedContext) {
    var inst = this._instance;
    !(inst != null) ? process.env.NODE_ENV !== 'production' ? invariant(false, 'Attempted to update component `%s` that has already been unmounted (or failed to mount).', this.getName() || 'ReactCompositeComponent') : _prodInvariant('136', this.getName() || 'ReactCompositeComponent') : void 0;

    var willReceive = false;
    var nextContext;

    // Determine if the context has changed or not
    if (this._context === nextUnmaskedContext) {
      nextContext = inst.context;
    } else {
      nextContext = this._processContext(nextUnmaskedContext);
      willReceive = true;
    }

    var prevProps = prevParentElement.props;
    var nextProps = nextParentElement.props;

    // Not a simple state update but a props update
    if (prevParentElement !== nextParentElement) {
      willReceive = true;
    }

    // An update here will schedule an update but immediately set
    // _pendingStateQueue which will ensure that any state updates gets
    // immediately reconciled instead of waiting for the next batch.
    if (willReceive && inst.componentWillReceiveProps) {
      if (process.env.NODE_ENV !== 'production') {
        measureLifeCyclePerf(function () {
          return inst.componentWillReceiveProps(nextProps, nextContext);
        }, this._debugID, 'componentWillReceiveProps');
      } else {
        inst.componentWillReceiveProps(nextProps, nextContext);
      }
    }

    var nextState = this._processPendingState(nextProps, nextContext);
    var shouldUpdate = true;

    if (!this._pendingForceUpdate) {
      if (inst.shouldComponentUpdate) {
        if (process.env.NODE_ENV !== 'production') {
          shouldUpdate = measureLifeCyclePerf(function () {
            return inst.shouldComponentUpdate(nextProps, nextState, nextContext);
          }, this._debugID, 'shouldComponentUpdate');
        } else {
          shouldUpdate = inst.shouldComponentUpdate(nextProps, nextState, nextContext);
        }
      } else {
        if (this._compositeType === CompositeTypes.PureClass) {
          shouldUpdate = !shallowEqual(prevProps, nextProps) || !shallowEqual(inst.state, nextState);
        }
      }
    }

    if (process.env.NODE_ENV !== 'production') {
      process.env.NODE_ENV !== 'production' ? warning(shouldUpdate !== undefined, '%s.shouldComponentUpdate(): Returned undefined instead of a ' + 'boolean value. Make sure to return true or false.', this.getName() || 'ReactCompositeComponent') : void 0;
    }

    this._updateBatchNumber = null;
    if (shouldUpdate) {
      this._pendingForceUpdate = false;
      // Will set `this.props`, `this.state` and `this.context`.
      this._performComponentUpdate(nextParentElement, nextProps, nextState, nextContext, transaction, nextUnmaskedContext);
    } else {
      // If it's determined that a component should not update, we still want
      // to set props and state but we shortcut the rest of the update.
      this._currentElement = nextParentElement;
      this._context = nextUnmaskedContext;
      inst.props = nextProps;
      inst.state = nextState;
      inst.context = nextContext;
    }
  },

接下来我们一步步分析这个逻辑方法的步骤：
      （1） 首先，判断内容是否发生了变化，如果内容发生了变化将context,将nextUnmaskedContext经过this._processContext()方法处理后存储到nextContext
      （2） 检测props或者state是否发生改变，如果props发生改变，那么state没有更新，props有更新，则调用componentWillReceiveProps声明周期方法，更新props
      （3） _processPendingState来处理state更新，如果需要更新，则从_pendingStateQueue获取新的replace的标志位以及最新的state。
      （4） 判断component是否需要更新虚拟DOM，如果需要更新则调用_performComponentUpdate，否则只对props、state、context进行更新。
最后来介绍之前说到的ReactUpdates文件中flushBatchedUpdates方法中的asp。

if (asapEnqueued) {
      asapEnqueued = false;
      var queue = asapCallbackQueue;
      asapCallbackQueue = CallbackQueue.getPooled();
      queue.notifyAll();
      CallbackQueue.release(queue);
}
/**
 * Enqueue a callback to be run at the end of the current batching cycle. Throws
 * if no updates are currently being performed.
 */
function asap(callback, context) {
  invariant(batchingStrategy.isBatchingUpdates, "ReactUpdates.asap: Can't enqueue an asap callback in a context where" + 'updates are not being batched.');
  asapCallbackQueue.enqueue(callback, context);
  asapEnqueued = true;
}

      Asap的功能是使当前更新内容结束后调用asapCallbackQueue中的回调函数，如果没更新，则立即调用。
修改：
原理就说到这里了，乱的不得了，下面我们将梳理具体的流程。