-2

I know that you can chain functions on an $( ) object with using dot notation e.g. $( ).delay().fadeIn().delay().fadeOut(), etc.

However this also works,

$( ).delay()
$( ).fadeIn()
$( ).delay()
$( ).fadeOut()

My intuition tells me that all methods should be independent, however they actually are sequential. I was curious if there was like a queue of functions inside the JQuery object that allowed this. Thanks,

Armanc Keser
  • 1
  • 3
  • https://stackoverflow.com/questions/11631711/how-can-i-learn-how-jquery-selectors-work-behind-the-scenes – Alex McMillan Mar 05 '19 at 19:59
  • Chainable jQuery functions basically just `return this;` at the end - if you are calling them on the same jQuery object, there is literally no difference in your 2 examples... however, if you are looking up the DOM (eg: `$('div')`) then there are potentially cached results, or it could be hitting the DOM each time in succession (which you'd want to avoid). – Alex McMillan Mar 05 '19 at 20:01
  • You're referring to a [Fluent Interface](https://en.wikipedia.org/wiki/Fluent_interface) or [Method Chaining](https://en.wikipedia.org/wiki/Method_chaining) which you can read about. – Erik Philips Mar 05 '19 at 20:04
  • that second snippet isn't doing any chaining. It's just one piece of code running after another. – Kevin B Mar 05 '19 at 20:05

1 Answers1

-1

delay(), fadeIn(), and fadeOut() all work by applying operations to the internal animation queue that jQuery maintains. As such, each call adds operations to the queue, and they (the queued operations) execute in the order they are added on the queue.

http://api.jquery.com/delay/ makes reference to this queue as the second argument, which if not provided defaults to the fx queue.

Taplar
  • 24,788
  • 4
  • 22
  • 35