What's the differences between t.onclick = doSomething and t.onclick = doSomething() in javascript?

Question

Possible Duplicate:
javascript syntax: function calls and using parenthesis

 t.onclick = doSomething 

 t.onclick = doSomething()

what's the different between the two event registrations?

sometimes I would confuse about them,add an parentheses seems would not cause big problem?

Answer 1

The first one assigns a reference to doSomething to the onclick property. The second assigns the return value of doSomething. That's unlikely to be what you want, unless doSomething returns a function.

Assign a reference:

function doSomething() {
    console.log("something");
}
//When t is clicked, "something" is logged
t.onclick = doSomething;

Assign the return value:

function doSomething() {
    console.log("something");
}
//"something" is logged immediately. When clicked, nothing happens
t.onclick = doSomething();

Assign a returned function:

function doSomething() {
    return function() {
        console.log("something");
    };
}
//When t is clicked, "something" is logged
t.onclick = doSomething();

Answer 2

The manner in which you reference objects means a lot in JS. There's a difference between doSomething; and doSomething(); because the first is referencing the function and the latter is referencing the return value of the function. Let's look at this example and you'll see what I mean. doSomething(); not only invokes the function but returns the return value of the function:

function doSomething() {
    return 5;
}

console.log(doSomething); // function() { return 5; }

console.log(doSomething()); // 5

So doing t.onclick = doSomething; is very much like saying t.onclick = function() { return 5; };