Javascript self executing function “is not a function”

Question

I have:

var Init = (function() {
   my js goes here
})();

And my js executes correctly when the page is loaded. I also have:

$('form :checkbox').change(function() {
   Init();
});

But firebug says Init is not a function.

Answer 1

It isn't a function.

(function() {
   ...
})()

evaluates the anonymous function right then. And the result of the evaluation apparently does not return a function-object in this case :-)

Consider:

f = (function() {
   return "not a function :("
})()
alert(f())

and

f = (function() {
   return function () { return "Yay!" }
})()
alert(f())

Happy coding :)

---

Here is a function which will "execute something once" and then "return that something to execute later". (See "You can either [assign] a function or call it; you can't do both..." from Slaks answer.) However, I wouldn't do it like this.

Init = (function () {
  function Init () {
    alert("whee!")
  }
  Init()
  return Init
})()
Init()

Here is another solution (much shorter/cleaner) from CD Sanchez (see comment) which takes advantage of the fact that an assignment evaluates to the assigned value:

var Init; (Init = function Init () {
  alert ("wee");
})()

Answer 2

In order for Init to execute as a function, your code within the self-executing function must return a function, and the only reason to do this is if you need to construct a specific function dynamically dependent upon some data states:

var Init = (function() {

    // some code

    return function () {
        // some dynamic code dependent upon your previous code
    };

}());

Answer 3

Init isn't a function; it's the result of calling the function.

You can either create a function or call it; you can't do both at once.

Technically, you could fix that by adding return arguments.callee; to return the function from the call.
However, that's a dumb idea.

You probably shouldn't be calling the function; you need to understand what you want your code to do.

Answer 4

Quick one Try replacing like this

var Init = function() {
   my js goes here
});

and on load call Init

Answer 5

you could do as above, but you could also do

function Init(){...}(); 

There's nothing to stop you from having a named self-executing function. If you want to avoid having a function named Init, you can do as CD Sanchez suggested and assign it in the execution.

The (); at the end makes it self executing. Wrapping the function in parentheses makes it anonymous. But it seems that you don't want it to be anonymous.

Answer 6

You may try declaring it this way:

(function Init(){ 
    /*...*/ 
})();

But this will reduce usage of this function into it's body

Other way is to separate declaration from execution:

var Init = function(){
    /*...*/
    },
    initResult = (function(){ return Init(); })();