Я новичок в обработчиках событий, и я столкнулся с кодом, который написан ниже
document.addEventListener("DOMContentLoaded", function() {
initialiseMediaPlayer();
}, false);
Есть ли разница в написании того же кода, что и
document.addEventListener("DOMContentLoaded", initialiseMediaPlayer();, false);
В конечном счете мы вызываем одну и ту же функцию, так что это имеет значение или есть ли преимущество в написании этого в соответствии с вышеизложенным способом?
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. Опять же, эффект не очень заметен с точки зрения пользователя.
1). Да, есть большая разница. Вторая версия вызовет ошибку. Но даже если вы исправите это так:
document.addEventListener("DOMContentLoaded", initialiseMediaPlayer(), false);
initialiseMediaPlayer не будет вызываться на DOMContentLoaded, потому что () заставляет его выполнять немедленно, в то время как вам нужно передать рефезию функции, а не ее результат.
2). Другим существенным отличием является контекст вызова.
document.addEventListener("DOMContentLoaded", initialiseMediaPlayer, false);
initialiseMediaPlayer будет вызываться в контексте объекта document. Хотя первая версия будет вызвана в контексте объекта Window.
Второй аргумент функции addEventListener() принимает функцию типа. Поэтому вы не можете передать initialiseMediaPlayer();, потому что это вызов функции.
Что вы можете сделать:
var onDOMContentLoaded = function() {
initialiseMediaPlayer();
};
document.addEventListener("DOMContentLoaded", onDOMContentLoaded, false);
в первом случае
document.addEventListener("DOMContentLoaded", function() {
initialiseMediaPlayer();
}, false);
анонимная функция function(){initialiseMediaPlayer();} регистрируется для запуска, когда запускается событие документа "DOMContentLoaded"
во втором случае:
document.addEventListener("DOMContentLoaded", initialiseMediaPlayer();, false);
то, что зарегистрировано как прослушиватель событий, является результатом выражения initialiseMediaPlayer()
Итак, да, есть разница:)