jQuery stuff I haven't seen before

[csdude55]

I'm working with a jQuery plugin, and it has some unusual coding that I think might be kinda old school, so I wanted to run it by y'all.

First, I see this:

var $elem = jQuery(this);

I've never seen jQuery(this)... is that the same as $(this)? If so, I could just change $elem throughout the script and save a variable process, right?

Second, I see a function like this:

;(function($) {
 ...
})(jQuery);

The opening ; already throws me off, but I've never seen (function($) { ... })(jQuery), either. Is this the same as $(function() { ... })?

[csdude55]

Oh, and then there's:

(function (factory) {
 ...
 }(function($) {
  ...
 });
);

I don't even know where to begin to decipher that one...

[csdude55]

Well, based on poking and prodding, I'm almost positive that var $elem = jQuery(this); is the same as $(this). But what I'm not sure about is the usage:

;(function($) {
 ...
 function startHandler(event) {
  var $elem = jQuery(this);
  ...
 }
})(jQuery);

In another function after startHandler() I see that the author used $(this), so the concept was available when he wrote it... is there a reason that he would have used jQuery(this) instead? Something weird about the ;(function($) { ... })(jQuery); format, maybe?

[NickMNS]

I'm almost positive that var $elem = jQuery(this); is the same as $(this).

It is. $ is syntatic sugar for jQuery, basically you could replace all your $ with jQuery. As to the other stuff, I don't know enough about jQuery to comment.

[csdude55]

Any guess why he would use jQuery(this) in one function, and $(this) in another?

Is one faster than the other? Or maybe just that he wrote the first part in 2010 (for example) and added the second in 2016 without updating the first?

[NickMNS]

My understanding of this, but I am not certain, is that $ is variable that has been assigned the jQuery object with all its methods. If for some reason one would need a second jQuery instance, or if $ were used as variable somewhere else one could use 'jQuery' instead. You could assign the jQuery object to any variable but using something other than $ of jQuery will likely be confusing.

Is one faster than the other?

No, I doubt it.

Or maybe just that he wrote the first part in 2010 (for example) and added the second in 2016 without updating the first?

Again I doubt it.

[Dimitri]

Any guess why he would use jQuery(this) in one function, and $(this) in another?

May be just inconsistent programming, or /and pieces of code grabbed here and there then put together.

[Fotiman]

Yes,

jQuery(this)

is identical to

$(this)

in most cases.

$

is just an alias for

jQuery

. However, jQuery allows you to relinquish control of the

$

variable, in case you're loading another library that also uses a global

$

variable. See [api.jquery.com...]

As for the other code, the leading ; is to ensure that if you're concatenating multiple files, and the script before didn't end with a semicolon, this will ensure the code isn't incorrectly interpreted. For example:
// file 1

var log = console.log

// file 2

(function ($) {})(jQuery);

If you concatenate those:

var log = console.log(function($) {})(jQuery);

So by starting with a semicolon, it ensures the concatenated result contains separate statements:

var log = console.log;(function($) {})(jQuery);

Is this the same as $(function() { ... })?

No. Lets break it down. There's an anonymous function, which takes in a single parameter, which will be named

$

within the function:

function ($) {}

Next, that function is wrapped in parenthesis, and immediately invoked, passing in

jQuery

. This means the value of

$

within the function is going to be the

jQuery

object passed in.

(function ($) {
 // $ === jQuery
})(jQuery);