I want to better understand the jQuery '$' sign

Question

I'm looking to understand exactly what the symbol is bound to and how it was bound, and what its underlying structure looks like.

I'm guessing it's done with a label but I'm not experienced enough with JavaScript to be sure.

Answer 1

Odd question. The $ symbol is just an alias for jQuery.

So, instead of this:

jQuery('a').css('color','#f00');

...You can do this:

$('a').css('color','#f00');

It doesn't necessarily need to be $ either. If you like, you can ADD MORE MONEY. This works:

(function ($$$$$$) {
    $$$$$$('body').html('Nobody will mess with you when you have this much cash.');
}(jQuery));

It seems as though normal JavaScript variable naming rules apply:

• Variable names must begin with a letter
• Variable names can also begin with $ and _
• Variable names are case sensitive

If you wanted, your alias could be orange_peanut, but let's not do that for obvious reasons.

Hope that helps! :)

Answer 2

I remember being initially confused by this myself. But the $ is just a variable referring to the static, global JQuery object. There's absolutely nothing special about it being a dollar sign - it was just a convenient and short variable name that John Resig (presumably) assumed wasn't widely used elsewhere. You can see a similar pattern with the Underscore library using an underscore (_) as its default global variable.

Now, it does have some kind of odd calling patterns, because instead of a normal variable, where you use it like this:

myObj.myFunction(myParam); 

The JQuery static object is both an object and a function. So you can call it like this (a function):

$('div').empty();

Or sometimes like this (like an object):

$.ajax({url: "http://fiddle.jshell.net/favicon.png"});

But there are lots and lots and lots of things that it does, and lots of subtleties about how it does them. To get better information, just check out the JQuery documentation: http://api.jquery.com/. And look around at the JQuery questions here on SO - they've got lots of information. You'll pick it up eventually.

Answer 3

The $ is an alias for the main jQuery() function. In other words, it is a function object, as are all functions in Javascript, and it has a number of properties on it.