CallbackQueue源码

CallbackQueue模块用于添加、执行、重置回调函数队列,机能同jquery中的同名模块。

react中,使用var Export=PooledClass.addPoolingTo(CallbackQueue)工厂化CallbackQueue构造函数,实现功能是管理CallbackQueue实例的创建—— Export.getPooled方法、实例数据(回调函数及其执行上下文)的销毁—— Export.release方法。销毁数据的实例存入Export.instancePool实例池中,可通过Export.getPooled方法取出。

'use strict';

var _prodInvariant = require('./reactProdInvariant');// 生产环境React形式带url报错

// 校验构造函数必须带new关键字调用,不能作为普通函数使用
function _classCallCheck(instance, Constructor) { 
  if (!(instance instanceof Constructor)) { 
    throw new TypeError("Cannot call a class as a function"); 
  } 
}

// PooledClass.addPoolingTo(CopyConstructor)用于将构造函数CopyConstructor转化为工厂函数
// 意义是管理实例数据的创建和销毁,并将销毁数据的实例推入到实例池CopyConstructor.instancePool中
var PooledClass = require('./PooledClass');

// invariant(condition,format,a,b,c,d,e,f) condition为否值,替换format中的"%s",并throw error报错  
var invariant = require('fbjs/lib/invariant');

// 用于添加、执行、重置回调函数队列;react中实际使用是用于挂载componentDidMount等钩子方法
// 通过PooledClass模块管理实例的创建CallbackQueue.getPooled,以及实例数据的销毁CallbackQueue.release
var CallbackQueue = function () {
  function CallbackQueue(arg) {
    _classCallCheck(this, CallbackQueue);

    this._callbacks = null;
    this._contexts = null;
    this._arg = arg;
  }

  // 往回调队列中添加回调函数及其执行的上下文,通过notifyAll方法触发
  CallbackQueue.prototype.enqueue = function enqueue(callback, context) {
    this._callbacks = this._callbacks || [];
    this._callbacks.push(callback);
    this._contexts = this._contexts || [];
    this._contexts.push(context);
  };

  // 触发回调函数队列内函数的执行;回调函数个数与其执行上下文个数不匹配,则报错
  CallbackQueue.prototype.notifyAll = function notifyAll() {
    var callbacks = this._callbacks;
    var contexts = this._contexts;
    var arg = this._arg;
    if (callbacks && contexts) {
      !(callbacks.length === contexts.length) ? 
        process.env.NODE_ENV !== 'production' ? 
          invariant(false, 'Mismatched list of contexts in callback queue') 
          : _prodInvariant('24') 
        : void 0;
      this._callbacks = null;
      this._contexts = null;
      for (var i = 0; i < callbacks.length; i++) {
        callbacks[i].call(contexts[i], arg);
      }
      callbacks.length = 0;
      contexts.length = 0;
    }
  };

  // 获取回调函数队列中的回调函数个数
  CallbackQueue.prototype.checkpoint = function checkpoint() {
    return this._callbacks ? this._callbacks.length : 0;
  };

  // 将回调函数队列中的回调函数个数设定为参数len
  CallbackQueue.prototype.rollback = function rollback(len) {
    if (this._callbacks && this._contexts) {
      this._callbacks.length = len;
      this._contexts.length = len;
    }
  };

  // 重置回调函数队列
  CallbackQueue.prototype.reset = function reset() {
    this._callbacks = null;
    this._contexts = null;
  };

  // PooledClass模块装饰需要,设置destructor方法供release方法使用,用于销毁实例数据
  CallbackQueue.prototype.destructor = function destructor() {
    this.reset();
  };

  return CallbackQueue;
}();

// 通过PooledClass模块管理实例的创建CallbackQueue.getPooled,以及实例数据的销毁CallbackQueue.release
module.exports = PooledClass.addPoolingTo(CallbackQueue);

相关推荐