Javascript addEventListener функция

Я новичок в обработчиках событий, и я столкнулся с кодом, который написан ниже

document.addEventListener("DOMContentLoaded", function() {
    initialiseMediaPlayer();
}, false);

Есть ли разница в написании того же кода, что и

document.addEventListener("DOMContentLoaded", initialiseMediaPlayer();, false);

В конечном счете мы вызываем одну и ту же функцию, так что это имеет значение или есть ли преимущество в написании этого в соответствии с вышеизложенным способом?

Ответы

Ответ 1

document.addEventListener("DOMContentLoaded", function() {
    initialiseMediaPlayer();
}, false);

Выполняет initialiseMediaPlayer при загрузке содержимого dom.

document.addEventListener("DOMContentLoaded", initialiseMediaPlayer();, false);

является синтаксической ошибкой; если вы удалите точку с запятой:

document.addEventListener("DOMContentLoaded", initialiseMediaPlayer(), false);

вызывает initialiseMediaPlayer сразу, затем передает возвращаемое значение (которое скорее всего не является функцией) на addEventListener. Это не будет действовать по желанию.

Вы можете сделать

    document.addEventListener("DOMContentLoaded", initialiseMediaPlayer, false);

(удалите круглые скобки = вызов функции). Затем initialiseMediaPlayer будет выполняться на загруженном dom-содержимом и действовать по желанию.

Однако, в отличие от первого случая, initialiseMediaPlayer фактически получит аргументы, данные браузером. Кроме того, его возвращаемое значение принимается браузером. В случае DOMContentLoaded, скорее всего, это не имеет большого значения.

Вы также избегаете создания дополнительной анонимной функции, если вы передаете непосредственно initialiseMediaPlayer. Опять же, эффект не очень заметен с точки зрения пользователя.

Ответ 2

1). Да, есть большая разница. Вторая версия вызовет ошибку. Но даже если вы исправите это так:

document.addEventListener("DOMContentLoaded", initialiseMediaPlayer(), false);

initialiseMediaPlayer не будет вызываться на DOMContentLoaded, потому что () заставляет его выполнять немедленно, в то время как вам нужно передать рефезию функции, а не ее результат.

2). Другим существенным отличием является контекст вызова.

document.addEventListener("DOMContentLoaded", initialiseMediaPlayer, false);

initialiseMediaPlayer будет вызываться в контексте объекта document. Хотя первая версия будет вызвана в контексте объекта Window.

Ответ 3

Второй аргумент функции addEventListener() принимает функцию типа. Поэтому вы не можете передать initialiseMediaPlayer();, потому что это вызов функции.

Что вы можете сделать:

var onDOMContentLoaded = function() {
    initialiseMediaPlayer();
};
document.addEventListener("DOMContentLoaded", onDOMContentLoaded, false);

Ответ 4

в первом случае

document.addEventListener("DOMContentLoaded", function() {
    initialiseMediaPlayer();
}, false);

анонимная функция function(){initialiseMediaPlayer();} регистрируется для запуска, когда запускается событие документа "DOMContentLoaded"

во втором случае:

document.addEventListener("DOMContentLoaded", initialiseMediaPlayer();, false);

то, что зарегистрировано как прослушиватель событий, является результатом выражения initialiseMediaPlayer()

Итак, да, есть разница:)