Question

Possible Duplicate:
What does this JavaScript/jQuery syntax mean?

I specifically mean when you do this:

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

I’ve never seen that kind of syntax before. How does the function get called? I understand when you do it like this:

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

because the function is being passed to jQuery, and jQuery can just run any function passed as a parameter when the DOM’s ready, but the first one’s different.

Answer 1

Duplicate of What does this JavaScript/jQuery syntax mean?

I’ll post my answer here, though seeing as Jeff Attwood seems to want us to embrace duplication: (https://blog.stackoverflow.com/2010/11/dr-strangedupe-or-how-i-learned-to-stop-worrying-and-love-duplication/)

---

This convention is used when writing plugins to ensure there is no confilict with other Javascript libraries using the $ notation, whilst ensuring the plugin author can still use this notataion:

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

The author is declaring an anonymous function with a single parameter ($), then immediately calling it and passing the jQuery object to it. This ensures the function is called and that everything in it is defined.

A longer notation might be:

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

Although that would create a variable MyDefs in the global namespace. The anonymous function pattern leaves the global namespace empty, avoiding conflicts.