Menu
Is there any difference if I do:
$queue.queue(function(next){
//...
next();
}).queue(function(next){
//...
next();
});
versus
$queue.queue(function(){
//...
$(this).dequeue();
}).queue(function(){
//...
$(this).dequeue();
});
Do they do the same thing?
What are the differences and which should I use?
It's weird cause the jQuery docs does not really mention .next(), they always say to use .dequeue() but at my workplace people use the .next() function so this has got me rather confused.
347
Deque is short for the double-ended queue which means that it efficiently supports adding and removing items from both ends. They are designed to perform these specific tasks efficiently. If you need to remove or add elements to the ends of a linear sequence, then use deques.
It has two operations enqueue and dequeue. Enqueue is used to insert the element and dequeue is used to delete the element from the queue.
A queue is designed to have elements inserted at the end of the queue, and elements removed from the beginning of the queue. Where as Dequeue represents a queue where you can insert and remove elements from both ends of the queue.
The Dequeue() method is used to returns the object at the beginning of the Queue. This method is similar to the Peek() Method. The only difference between Dequeue and Peek method is that Peek() method will not modify the Queue but Dequeue will modify.
That I know of, there is no difference. I'm not sure why one would be preferable to the other or why they are both mentioned as that is confusing to me.
Looking at http://code.jquery.com/jquery-1.9.1.js we see:
1915 next = function() {
jQuery.dequeue( elem, type );
};
...in the jQuery.dequeue method. This is called a bit later on (on line 1936) as fn.call(elem, next, hooks). You see that next is the first parameter in the queue callback, and fn is queue at that time.
Looking ahead, we see
1983 dequeue: function( type ) {
return this.each(function() {
jQuery.dequeue( this, type );
});
},
This is defined on jQuery.fn, so that is the function called by $(this).dequeue. However, this does exactly the same thing. The only difference is the element that is dequeued. In fn.dequeue it loops over the collection, but that will only be one element for $(this).
If we look back, we see what elem is though:
1908 dequeue: function( elem, type ) {
...hey, wait a second .. it's this (when called from $(this).dequeue)! Thus you can see that they do exactly the same thing. $("some other collection").dequeue would work differently, though.
Calling next() saves you an additional .each call, so I guess that would be faster.
By the way, you don't have to call it next in the callback since you can rename parameters to whatever you want.
EDIT: Per my mini-discussion with my illustrious colleague @FabrícioMatté, there can actually be a difference in functionality between next() and $(this).dequeue(), specifically when not using the standard fx queue. When the next function is created, it is set to call $.dequeue with the type acquired from the queue already, but $.fn.dequeue takes the type as an argument. This is possibly even more motivation to stick with next(), although I've never actually seen someone use anything other than the standard effects queue practically.
119
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
