асинхронная операция это когда наша функция выносится из колстека на внешний Api, а потом когда колл стек пуст - заносит эту функцию назад в колстек и исполняет ее?
Но обработчики событий весят тоже на внешнем Api, и исполняются тоже когда коллстек пуст, так же само как и при асинхронной операции.
проще говоря
есть stack - синхронный поток
есть stack queue(вроде так) - асинхронный поток
сначала выполняется синхронный код, потом асинхронный
web api - встроенные в браузер, скажем так, дополнительные свойства
setTimeout, document и тд, ты просто тянешь это свойство
когда ты пишешь
document.addEventListener - то есть ты обращаешься к web api и говоришь, добавь документу обработчик, как-то так
есть еще понятие как микро/макро задачи, их поведения в разных браузерах, но то совсем другое уже