# JS Tip of the Day: addEventListener Options

**URL:** <https://forum.kirupa.com/t/js-tip-of-the-day-addeventlistener-options/643163>\
**Category:** web dev\
**Created:** [March 4, 2020, 2:50pm UTC](https://forum.kirupa.com/t/js-tip-of-the-day-addeventlistener-options/643163 "2020-03-04T14:50:46Z")\
**Posts on this page:** 1\
**Page:** 1

<div class="post-metadata">

**Author:** ![senocular](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/senocular/32/7217_2.png) [@senocular](https://forum.kirupa.com/u/senocular)\
**Post date:** [March 4, 2020, 2:50pm UTC](https://forum.kirupa.com/t/js-tip-of-the-day-addeventlistener-options/643163/1 "2020-03-04T14:50:46Z")

</div>

**addEventListener Options**  
Level: Beginner

Old school JavaScript coders may recognize the `addEventListener` function signature as something looking like the following:

```javascript
eventTarget.addEventListener(type, listener, useCapture)

```

Where the only option available is the `useCapture` option in the 3rd argument. Modern implementations of `addEventListener`, however, support an options object in place of `useCapture`. This options object supports the `useCapture` option (now `capture`) as well as a few others, including:

- **capture** : A Boolean indicating that events of this type will be dispatched to the registered listener before being dispatched to any EventTarget beneath it in the DOM tree.
- **once** : A Boolean indicating that the listener should be invoked at most once after being added. If true, the listener would be automatically removed when invoked.
- **passive** : A Boolean which, if true, indicates that the function specified by listener will never call preventDefault(). If a passive listener does call preventDefault(), the user agent will do nothing other than generate a console warning. See Improving scrolling performance with passive listeners to learn more.

So presently, the signature of `addEventListener` is as follows:

```javascript
eventTarget.addEventListener(type, listener, { capture, once, passive })

```

And future iterations of `addEventListener` could add even more options.

Curious if the browser your users are using supports this options object? It’s easy. Just use the ridiculous approach outlined in the MDN link below.

More info:

- [addEventListener on MDN](https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener)
