jQuery队列(二)

继续阅读队列提供的方法。

jQuery.extend({
    queue: function( elem, type, data ) {}, // 将data按照某种类型存储到elem对应的队列中,并等待执行。同时返回目前队列中的所有数据

    dequeue: function( elem, type ) { // 出列操作,如果想要执行队列中的所有方法,则有多少个方法就需要执行多少次dequeue方法

    // 如果指定类型就按照指定类型查找,否则默认是“fx”

    type = type || "fx";

    // 拿出队列中的所有数据

    var queue = jQuery.queue( elem, type ),
      startLength = queue.length,

      // 取出队列(数组)中的第一个值(先进先出),(第一个数据是上一次执行dequeue时添加到队列中的“inprogress”占位符?)
      fn = queue.shift(),

      // ??
      hooks = jQuery._queueHooks( elem, type ),

      // 取出队列中的下一个
      next = function() {
        jQuery.dequeue( elem, type );
      };

    // 当进行出栈操作时,总是删除名为“inprogress”的数据,并继续取下一条。
    if ( fn === "inprogress" ) {
      fn = queue.shift();
      startLength--;
    }

    if ( fn ) {

      // 添加占位符,阻止自动出栈(注释中是这么写的,不明白为什么会自动执行出栈操作)
      if ( type === "fx" ) {
        queue.unshift( "inprogress" );
      }

      // ?
      delete hooks.stop;

      // 执行方法
      fn.call( elem, next, hooks );
    }

    if ( !startLength && hooks ) {
      hooks.empty.fire();
    }

    }, // 从elem相应类型对应的队列中下一条数据并执行这条数据
    _queueHooks: function( elem, type ) {

    var key = type + "queueHooks";
    return data_priv.get( elem, key ) || data_priv.access( elem, key, {
      empty: jQuery.Callbacks("once memory").add(function() {
        data_priv.remove( elem, [ type + "queue", key ] );
      })
    });

  } // 内部使用
});
// 提供给用户的挂载在jQuery对象上的方法
jQuery.fn.extend({

  // 从队列中取数据或者向队列中推数据
    queue: function( type, data ) {    

    var setter = 2;

    // 如果type的类型不是string,说明用户没有传入type,默认使用fx前缀。

    if ( typeof type !== "string" ) {
      data = type;
      type = "fx";
      setter--;
    }

    // 如果参数长度小于setter,说明用户要么只传了type,要么就什么都没传。这个时候用户是想要得到栈中的数据。

    if ( arguments.length < setter ) {

      // 调用挂载到$上的方法,获取到栈中的数据返回
      return jQuery.queue( this[0], type );
    }

    // 如果没有传data,则直接返回this?否则的话为this中的每一个元素都推入一份data到栈中

    return data === undefined ?
      this :
      this.each(function() {
        var queue = jQuery.queue( this, type, data );

        // ?
        jQuery._queueHooks( this, type );

        // 如果type是fx(动画队列)并且队列的当前第一个元素不是inprogress,则取出当前队列的下一个元素并执行

        // 难道说动画队列不需要每个方法执行一下dequeue方法,而是自动执行的?

        if ( type === "fx" && queue[0] !== "inprogress" ) {
          jQuery.dequeue( this, type );
        }
      });

  },
    dequeue: function( type ) { 

    // 执行对象中所有元素对应的队列中的下一个函数

    return this.each(function() {
      jQuery.dequeue( this, type );
    });

  },
    delay: function( time, type ) {},

    clearQueue: function( type ) {},
    promise: function( type, obj ) {}
});

原文地址:https://www.cnblogs.com/charling/p/3488189.html