what is the difference between calling function in JavaScript with or without parentheses ()

Question

so a simple example would be

function a() {
    alert(\"something\");
}

anything.onclick = a; // this is without parentheses

anything.onclick = a(); // th         


        

Answer 1

The parenthesis at the end of the function is the permission for js engine to execute the function. If you don't supply it, it won't be executed at all.

x=a() //if you do this you are invoking the function but if u just pass "a" you are passing a pointer to a function

Answer 2

The difference is that a() calls the function while a is the function.

console.log( a() ); // false
console.log(  a  ); // function() {...}

To make it clear what technically happens when you use the second part of your example, let's redefine alike this:

a = function() {
    return 100;
};

and set the event handler:

anything.onclick = a();

f() not only calls the function f but returns its return value. So when setting a variable or object property to a function call, the return value of the function call will be assigned. So the above statement is effectlively equivalent to:

anything.onclick = 100;

which doesn't make sense and might cause an error. If a function doesn't have a return value, its return value is implicitly undefined.

However, if you had set a variable equal to a without calling it, it would be the same as setting a regular function expression to that variable:

var a = function() { ... },
    b = a; // b = function() { ... }

b would perform the same operation as a would.

So in your example go with the first one because it makes sense! The only case in which you would assign the return value of the function call to an event handler is if the function returns another function. For instance:

var x = function(xyz) {
    return function() {
        console.log(xyz);
    };
};

anything.onclick = x("Hello World"); // = function() {
                                     //       console.log("Hello World");
                                     //   }

Answer 3

Assigns reference:

anything.onclick = a; //assigns a reference

With your function it is:

anything.onclick = function() { 
    alert("something"); 
}

Executes method and assigns the returned result

anything.onclick = a(); //calls the method and assigns whatever is returned.

With your function it is:

anything.onclick = false;