Существует ли подобный шаблон привязки javascript событий к DOM?

Добрый день. Было бы интересно узнать, имеет ли право на существование подобный подход к связыванию элементов DOM с javascript-событиями:
jQuery.fn.eventHandler = function(){

    /*объект для хранения функций, применяемых к DOM элементам*/
    var function_storage = {
        testAlert : function(obj, args){
            alert(obj);
            alert(args);
        },
        testLog : function(obj, args){
            console.log(obj);
            console.log(args);
        }
    }
	
    this.each(function() {
        var event = $(this).data('event'),
            args = $(this).data('args'),
            func = $(this).data('func'),
        if (func != null) {
            if (event == null) {
                event = 'click';
            }
            $(this).on(event, function (e) {
                e.preventDefault();
                function_storage[func]($(this), args);
            });
        }
    });
};
	
$(document).ready(function(){
	$('.eventHandler').eventHandler();
});

При этом события добавляются непосредственно в HTML:
<div class="eventHandler" data-func="testAlert" data-event="mouseenter" data-args="test">Навешиваем mouseenter на div</div>

Интересуют плюсы и минусы подобного подхода, прежде всего в плане производительности.
  • Вопрос задан
  • 268 просмотров
Пригласить эксперта
Ответы на вопрос 2
Fesor
@Fesor
Full-stack developer (Symfony, Angular)
В целом норм, что-то похожее применяется в Angular (директива ng-click). Только там все чуть сложнее.
Ответ написан
teotlu
@teotlu
Навёрстываю упущенное
А если мне надо несколько событий на один блок повесить? Тогда уж имеет смысл передавать массив событий, например data-events='["click","mouseenter","mouseleave"]' и массив соответствующих обработчиков. А я бы вообще это оформил передачей объекта, где ключ — событие, а значение — обработчик (ну и аргументы туда тоже запихнуть куда-нибудь).
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы