How does JavaScript recogize event object variables?

Question

Quick question about JavaScript event objects - how does JavaScript know when I'm trying to pass an event variable to a function? For example, when I define an onclick handler like so:

<button onclick='SendMessage(event)'></button>

Does JavaScript pass the event variable just because I named it "event"? If so, what other variable names does it reserve for the purpose of passing event variables? (e? ev? etc..)

If this is the case, can they be covered by naming local or global variables "event", "e", etc.. ?

It just happens to pass it in as the first parameter, it has no idea what you've called the variable. Javascript doesn't have parameter types or even check for parameters when verifying function signatures since you can't use function overloading. — TheZ
– TheZ, Commented Jun 29, 2012 at 16:55
@TheZ That's not correct. event is a keyword in this case and it won't work with anything else. Now in your function, you can name the parameter anything you want. DEMO — sachleen
– sachleen, Commented Jun 29, 2012 at 16:59
It's not a keyword in any case. Calling it an "implicit parameter" or something might be more appropriate? — Dagg Nabbit
– Dagg Nabbit, Commented Jun 29, 2012 at 17:16

Community · Accepted Answer · 2020-06-20 09:12:55Z

It must be called event in an inline event. event is not a keyword and is not a reserved word in JavaScript; it is merely the variable name the early Netscape engineers decided upon.

The inline text supplied for the event is effectively wrapped ¹ as:

function (event) {
   // the inline code
}

IE uses the window.event property to pass event information, but the names coincide so using event will fallback through the normal JavaScript variable resolution as appropriate.

Of course, if attaching a function object directly then the event variable, because it's just the first parameter, can be named whatever is desired. Unfortunately IE's window.event approach must be dealt with as well, and calling the argument event doesn't address it.

elm.onclick = function (my_event_name) {
    my_event_name ||= window.event // for IE
    ...
}

(I would recommend avoiding inline events as much as possible and using a library that unifies/simplifies events.)

Happy coding!

¹ This behavior is covered in detail in HTML 5: Event Handlers, Event handler content attributes:

[inline event, e.g onclick, text] must contain valid JavaScript code which, when parsed, would match [a function] production ..

Using the script execution environment created above, create a function object .. Let the function have a single argument called event.

Collectives™ on Stack Overflow

How does JavaScript recogize event object variables?

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related