Пользовательские события и объединение событий в jQuery - В чем смысл?

Question

Я читал о пользовательских событиях в jQuery и почему они должны использоваться, но я по-прежнему явно не вижу смысла. Существует очень хорошая статья, которую я читал here, которая имеет следующий пример кода;

function UpdateOutput() { 
    var name = $('#txtName').val(); 
    var address = $('#txtAddress').val(); 
    var city = $('#txtCity').val(); 

    $('#output').html(name + ' ' + address + ' ' + city); 
} 

$(document).bind('NAME_CHANGE ADDRESS_CHANGE CITY_CHANGE', function() { 
    UpdateOutput(); 
}); 

$('#txtAddress').keyup(function() { 
    $(document).trigger('ADDRESS_CHANGE'); 
}); 
$('#txtCity').keyup(function() { 
    $(document).trigger('CITY_CHANGE'); 
}); 

Может кто-нибудь сказать мне, почему я просто не называю функцию UpdateOutput() напрямую? Это будет по-прежнему работать точно так же, то есть

$('#txtAddress').keyup(function() { 
    UpdateOutput() 
}); 
$('#txtCity').keyup(function() { 
    UpdateOutput() 
}); 

Большое спасибо

Answer 1

Поскольку вы являетесь одним из клиентов этого мероприятия, даже если у вас есть полный контроль над всем приложением. Это помогает лучше разделить код.

Как один из клиентов, которым интересно знать, когда имя, адрес или город меняются, вы обновляете значения в некоторой части экрана. Некоторый другой клиент может захотеть сделать что-то еще, например, вытащить все соседние города, обратный геокодировать адрес, выполнить поиск имени на namesdatabase.com и т. Д.

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

Вторая причина - абстракция. Например, удаление учетной записи пользователя может быть вызвано простым щелчком, но, просто переведя это на событие более высокого уровня, например DeleteAccount, все станет проще и понятным, если учесть, что могут быть десятки или сотни, или, может быть, даже тысячи таких событий по всему приложению. Работая на более высоком уровне абстракции, чем «keyups», «keydowns», «mouseovers» и т. Д. (Которые действительно бессмысленны в любом случае в контексте приложения и намерения), все может стать намного более управляемым, поскольку приложение размер растет.

Answer 2

Как your article начинается с:

Как всем известно, чем больше зависимостей у вас есть в системе, тем труднее поддерживать эта система есть. Javascript не является исключением - и организация действий в сложных пользовательских интерфейсах может быть кошмаром, если это не сделано должным образом.

Использование событий удаляет (некоторые из) этих зависимостей:

• Когда что-то происходит (клавиша отпущена/вверх), уведомление об этом событии отправки, без узнать, есть ли кто-то заинтересован на данный момент или нет.
• Когда кто-то заинтересовано в определенном случае он может подписаться на него, без зная, почему это событие было вызвано (клавиша отпущена)

Оба пуль независимы, первыми оповещают и второй отвечает. Удаление одного не имеет значения для функциональности другого. Также легко иметь несколько экземпляров, запускающих/подписывающихся на события (также из-за недостающих зависимостей).

Answer 3

Совершенно разумно напрямую подключить вызов UpdateOutput(). Часто трудно представить необходимость абстракции, которую пользовательский пул событий предоставляет в простых примерах.

Однако при вызове UpdateOutput есть (возможно) две проблемы ремонтопригодности (опять же, в зависимости от использования). Первая проблема возникает, повторяя вызов UpdateOutput() во многих местах. Это делает рефакторинговые функции (особенно с параметрами) чрезвычайно сложными, когда они меняются. С пулом событий вы можете подготовить данные перед передачей его функции, что полезно, когда разрозненные блоки кода вызывают одну и ту же функцию. С ajax тяжелыми веб-приложениями вокруг, управление вызовами функций очень важно.

Во-вторых, возможно, вам понадобится вызвать несколько функций для одного и того же события. Представьте, что в дополнение к UpdateOutput() есть также функция проверки, которая должна быть запущена. Или когда пользователь обновляет почтовый индекс, некоторые карты api запускаются, чтобы показать что-то, или как бы то ни было другие функции, которые могут произойти (в том случае, если вы можете иметь множество функций, вызываемых в простом событии keyup(). для очень больших блоков кода, которые просто вызывают несколько функций, и если есть необходимая условная логика, они могут выйти из-под контроля. Переписанный пулом событий, вы получаете намного больше контроля над тем, как вызывается функция, например UpdateOuput,