self executing function jquery vs javascript difference

Question

What are the difference among -

First :-

(function () {      var Book = 'hello';  }()); 

Second:-

(function () {      var Book = 'hello';  })(); 

First and second are similar some how in work..

Third :-

(function ($) {      var Book = 'hello';  })(jQuery); 

What pattern I need to use and where in my coding.. Third module pattern I have seen while I was reading a article related to backboneJS.

What I understood from Third one "self executing function with the argument “jQuery”" ....

Can any please give me some idea about Immediately Invoked Function Expressions (IIFE).

Thanks !!

Answer 1

In all cases you are doing an anonymous function. I think 1 is the same as 2. In the third case you are passing jQuery as an argument. This is done when you want to encapsulate jQuery within your function's scope.

For instance, in your application, jQuery var could be jQuery. But within your anonymous function you may want to use it as $.

(function ($) {     //Here jQuery is $     var Book = $(document.body).text();      })(jQuery);  //Out of your function, you user jQuery as jQuery (in this example) var Book = jQuery(document.body).text(); 

Answer 2

This is called a closure to avoid conflicts with other libraries such as mootools which are using $. This way you can ensure to use $ in that function with passing jQuery as a param.

(function ($) {    $(function () { // Here in this block you can use '$' in place of jQuery     .......    }); })(jQuery); //<----passing jquery to avoid any conflict with other libraries.