Why is ‘false’ used after this simple addEventListener function?

I checked MDN too, but I still didn’t understand what the useCapture was for, so this answer is for those who still don’t get it after having checked the official documentation.

So first of all, the following happens in almost all browers:

In all browsers, except IE<9, there are two stages of event processing.

The event first goes down – that’s called capturing, and then bubbles up . This behavior is standartized in W3C specification.

which means no matter what you set the useCapture to, these two event phases always exist.

This picture shows how it works.

According to this model, the event:

Captures down – through 1 -> 2 -> 3.

Bubbles up – through 3 -> 2 -> 1.

Then comes your question. The 3rd param called useCapture indicates on which of the two phases you want your handler to handle the event.

useCapture = true

The handler is set on the capturing phase. Events will get to it before getting to its children.

useCapture = false.

The handler is set on the bubbling phase. Events will get to it after getting to its children.

which means that if you write code like this:

child.addEventListener("click", second);
parent.addEventListener("click", first, true);

when clicking child element, first method will be called before second.

By default, the useCapture flag is set to false which means you handler will only be called during event bubbling phase.

For detailed info, click this reference link and this.