How does jQuery achieve making $ an alias for the jQuery function?

Question

I’m having a little trouble wrapping my head around the $ sign being an alias for the jQuery function, particularly in a plugin. Can you explain how jQuery achieves this aliasing: how does it define '$' to be an alias for the jQuery function? That's the first question.

Secondly, can you explain how/why the following code works to map '$' to the jQuery function in a plugin's definition and why if you don't do this, your plugin could collide with other libraries that might use the dollar sign?

(function( $ ){
    $.fn.myPlugin = function() {
        // Do your awesome plugin stuff here
    };
})(jQuery);

Answer 1

It simply declares a variable. See here

jQuery itself is a large self executing function. This means that it declares a function and then runs it. Inside the function it declares the local jQuery object which is a function.

It will then right at the end of it set window.jQuery = window.$ = jQuery

This is setting both window.jQuery and window.$ to the local jQuery object. We can set global variables by making them properties of the window object.

Now both window.jQuery and window.$ both point at jQuery since objects are passed by reference.

var jQuery = (function() {

    var jQuery = function( selector, context ) {
        ...
    };

    ...

    return (window.jQuery = window.$ = jQuery);

}());

it actaully declares jQuery twice for a small efficiency gain since the when looking for the variable it doesn't have to look upwards into an extra outer function.

You can use two assignments like that because (var a = b) === b

As others have mentioned the fact that $ is a legimate variable name and that functions are first class objects, thus we can treat them as objects also helps to make this possible.

Answer 2

A function, like any object in javascript, can be assigned to a variable. This variable can have any name (that follows the JS variable naming rules). "$" satisfies the naming rules, so the jQuery function is aliased to "$" for brevity. Consider the following example:

var myFn = function() { alert('myFunc'); };
var $ = myFn;

$();
// alerts 'myFunc'

Answer 3

Exact code (from jquery-1.4.1-vsdoc.js):

// Expose jQuery to the global object
window.jQuery = window.$ = jQuery;