What is the difference between window.onload = init(); and window.onload = init;

Question

From what I have gathered, the former assigns the actual value of whatever that functions return statement would be to the onload property, while the latter assigns the actual function, and will run after the window has loaded. But I am still not sure. Thanks for anyone that can elaborate.

Answer 1

window.onload = init();

assigns the onload event to whatever is returned from the init function when it's executed. init will be executed immediately, (like, now, not when the window is done loading) and the result will be assigned to window.onload. It's unlikely you'd ever want this, but the following would be valid:

function init() {
   var world = "World!";
   return function () {
      alert("Hello " + world);
   };
}

window.onload = init();

---

window.onload = init;

assigns the onload event to the function init. When the onload event fires, the init function will be run.

function init() {
   var world = "World!";
   alert("Hello " + world);
}

window.onload = init;

Answer 2

Good answers, one more thing to add:

Browser runtimes ignore non-object (string, number, true, false, undefined, null, NaN) values set to the DOM events such as window.onload. So if you write window.onload = 10 or any of the above mentioned value-types (including the hybrid string) the event will remain null.

What is more funny that the event handlers will get any object type values, even window.onload = new Date is a pretty valid code that will prompt the current date when you log the window.onload. :) But sure nothing will happen when the window.load event fires.

So, always assign a function to any event in JavaScript.