Question

What is the difference between following forms of function definition:

$.myFunction = function() {
    //function body
};

var myFunction = function() {
    //function body
};

$(myFunction = function() {
    //function body
});

Answer 1

$.myFunction = function() {
    //function body
};

This creates a function as a property of the $ object. If you’re using jQuery then $ is the global jQuery object. You would call this function with $.myFunction()

---

var myFunction = function() {
    //function body
};

This creates a function assigned to a variable called myFunction. If you do this inside another function, then myFunction will only be available in that scope.

---

$(myFunction = function() {
    //function body
});

This one is doing two things, let’s break it down into two steps to make it more clear:

myFunction = function() {    // step 1
    //function body
};
$(myFunction);               // step 2

1. The first step is creating a function assigned to a global variable called myFunction. The variable is global because you didn’t use the var keyword. In general, you probably don’t want to use a global variable, and certainly not when its definition isn’t very obvious.

2. The second step is (assuming you’re using jQuery) passing myFunction to jQuery to be executed when the DOM has finished loading. See the jQuery documentation for more information.

   It’s more common to pass a function to jQuery without assigning it to any variable, i.e.

   $(function() {
       //function body
   });