What does the '$' means in this code?

Question

<script>
jQuery(function($) {
    $('#container').jstree();
});
</script>

$ is passed into anonymous function, what does it mean?

Answer 1

The code looks like an attempt at the Module Pattern in JavaScript. The benefit is that the anonymous function has a closure that helps to maintain the privacy of variables within it and maintains the state of its local variables and functions.

The correct way to implement the pattern is:

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

where the (...)() is an example of an IIFE (Immediately Invoked Function Expression). The function expression is invoked by the trailing (), which if it contains jQuery will pass the jQuery function into the anonymous function's scope as $, since that is what it has as the parameter name. A benefit of this pattern is people can write jQuery plug-ins and can maintain their own copy of the jQuery function and variables and call them whatever they want, which helps resolve name conflicts.

The currently accepted answer is incorrectly interpreting the documentation, which is merely stating that if you have a function declaration, you can execute it as a callback when the document is ready by passing it to the jQuery function, which is equivalent to jQuery's $(document).ready(function(){...});

Answer 2

So in JQuery (Javascript library), the dollar sign is an alias/reference to a JQuery function.

In this case, the first line is equivalent to $(document).ready(), which waits for the DOM to finish loading before running.

Another words, functions you want to run after the DOM has finished loading (almost all functions really) you want to put inside this, as jstree() is.

Here is a relevant S.O. question

Here is a link to JQuery Documentation on Callbacks

Answer 3

In short: $ refers to a global variable that is set by JQuery to represent itself.

In not so short: Javascript variable naming conventions allow you to start a variable with '$', '_' or any valid unicode character in the categories “Uppercase letter (Lu)”, “Lowercase letter (Ll)”, “Titlecase letter (Lt)”, “Modifier letter (Lm)”, “Other letter (Lo)”, or “Letter number (Nl)”.

Therefore you are allowed to have the variable $ or _ on it's own. A lot of javascript frameworks/libraries/things exploit this fact to shorten their calls.

Answer 4

http://api.jquery.com/jQuery/#jQuery3

jQuery(function( $ ) { // Your code using failsafe $ alias here... });

Answer 5

JQUERY DOC :

jQuery() — which can also be written as $() — searches through the DOM ...

Thus :

$( "div.foo" ); is equal to jQuery( "div.foo" );

Answer 6

It makes "$" the local variable and thus gracefully avoids the conflicts with any other variables which possibly use "$" symbol.

These function all do the same things - execute some code when DOM is ready.

"$" and "jQuery" which accept function as an arguments were created as shortcuts to avoid repeating such a common construct. Accepting a function which accepts $ as its first argument is a further syntax sugar - now you get convenience of the closures without the need to do it yourself.

Answer 7

Read Documentation

jQuery(function( $ ) {
  // Your code using failsafe $ alias here...
});

and

$(function() {
  // Document is ready
});

Use both the shortcut for $(document).ready() and the argument to write failsafe jQuery code using the $ alias, without relying on the global alias.

Answer 8

$ is an alias of jQuery.

So you could also write jQuery('#container').jstree();

Answer 9

jQuery Documentation

A dollar sign ($) is actually an alias for jQuery function. And according to the documentation, if you pass a callback as an argument to this function, it will be executed when the DOM is ready.