JavaScript notifications onclick event

Question

as soon as Notification instantiates onclick function fires but I want prevent this event before actual click occures on notification

   var message = new Notification("RandomString");
   message.onclick(alert("Random Message"))

Answer 1

Try this:

var message = new Notification("RandomString");
message.onclick = function(){alert("Random Message")};

Answer 2

I'm going to break this down a little bit to make it more clear what your code is doing.

message.onclick() will invoke the onclick property of message, which is probably currently null and therefore can't be called as a function.

Inside of the () you have alert("Random Message"), which is going to be called right then. This means that the value of that function call will be passed in to the onclick function call as a parameter. alert() doesn't return anything, so the alert fires, then you're left with this:

message.onclick('undefined')

What you wanted to do was make onclick a function and have it call the alert.

message.onclick = function() {
  alert("Random Message")
};

Now you can fire that function by clicking the element it is attached to, or you can still fire it directly with message.onclick().

The best practice now is to use addEventListener rather than onclick. addEventListener will allow you to register multiple events of the same type.

message.addEventListener('click', function() {
  alert("Random Message");
});

Another thing that newer programmers often don't realize is that you don't have to make the function while attaching it as the event listener. Here's an example using both methods:

function foo() {
  alert("Random Message");
}

message.onclick = foo;

message.addEventListener('click', foo);