Как написать расширяемый «класс» на javascript? Подскажите лучшую практику чтоб писать простой но расширяемый и кастомизируемый функционал на javascript
начал гуглить - куча разных костылей чтоб имитировать классы не знаю какой выбрать
надо нечто вродеfunction Handler() {
function doSome() { ... }
};
var handler = new Handler();
handler.setOptions( { ... } );
handler.init();
для последующих проектов надо предусмотреть переопределение типаvar handler = new Handler();
handler.soSome = function() { changed logic };
handler.init();
в теле этого класса надо прибиндить некие события типа $(document).on('click',selector1,function(){}) ;
$(document).on('mouseenter',selector2,function(){});
$(document).on('keyup',selector3,function(){})
но в другом проекте возможно надо будет отключить один из этих сабскрайберов
еще по уму это все надо обернуть jQuery типа(function($){ .. })(jQuery)
подскажите прототип какой-то или хороший пример
Как написать расширяемый «класс» на javascript? Подскажите лучшую практику чтоб писать простой но расширяемый и кастомизируемый функционал на javascript
начал гуглить - куча разных костылей чтоб имитировать классы не знаю какой выбрать
надо нечто вродеfunction Handler() {
function doSome() { ... }
};
var handler = new Handler();
handler.setOptions( { ... } );
handler.init();
для последующих проектов надо предусмотреть переопределение типаvar handler = new Handler();
handler.soSome = function() { changed logic };
handler.init();
в теле этого класса надо прибиндить некие события типа $(document).on('click',selector1,function(){}) ;
$(document).on('mouseenter',selector2,function(){});
$(document).on('keyup',selector3,function(){})
но в другом проекте возможно надо будет отключить один из этих сабскрайберов
еще по уму это все надо обернуть jQuery типа(function($){ .. })(jQuery)
подскажите прототип какой-то или хороший пример
начал гуглить - куча разных костылей чтоб имитировать классы не знаю какой выбрать
надо нечто вродеfunction Handler() {
function doSome() { ... }
};
var handler = new Handler();
handler.setOptions( { ... } );
handler.init();
для последующих проектов надо предусмотреть переопределение типаvar handler = new Handler();
handler.soSome = function() { changed logic };
handler.init();
в теле этого класса надо прибиндить некие события типа $(document).on('click',selector1,function(){}) ;
$(document).on('mouseenter',selector2,function(){});
$(document).on('keyup',selector3,function(){})
но в другом проекте возможно надо будет отключить один из этих сабскрайберов
еще по уму это все надо обернуть jQuery типа(function($){ .. })(jQuery)
подскажите прототип какой-то или хороший пример
Не можешь разобраться в этой теме?
Обратись за помощью к экспертам
Гарантированные бесплатные доработки в течение 1 года
Быстрое выполнение от 2 часов
Проверка работы на плагиат
Поможем написать учебную работу
Для создания расширяемого и кастомизируемого функционала на JavaScript, вы можете использовать прототипы и конструкторы. Ниже приведен пример простого класса Handler с методами doSome, setOptions и init, а также возможностью переопределить метод doSome.
function Handler() {// Первоначальные настройки
this.options = {};
// Метод для выполнения какой-то логики
this.doSome = function() {
console.log('Doing something with options:', this.options);
};
// Метод для установки опций
this.setOptions = function(options) {
this.options = {
...this.options,
...options
};
};
// Метод инициализации
this.init = function() {
this.doSome();
};
}
var handler = new Handler();
handler.setOptions({ option1: 'value1', option2: 'value2' });
handler.init();
// Переопределение метода doSome
handler.doSome = function() {
console.log('Changed logic');
};
handler.init();
Для подписки на события в пределах объекта Handler, можно использовать метод bindEvents и метод unbindEvents для отключения событий.
function Handler() {// остальной код
// Метод для привязки событий
this.bindEvents = function() {
$(document).on('click', selector1, function() {
// Логика на событие click
});
$(document).on('mouseenter', selector2, function() {
// Логика на событие mouseenter
});
$(document).on('keyup', selector3, function() {
// Логика на событие keyup
});
};
// Метод для отключения событий
this.unbindEvents = function() {
$(document).off('click', selector1);
$(document).off('mouseenter', selector2);
$(document).off('keyup', selector3);
};
}
var handler = new Handler();
handler.bindEvents();
// Позже можно отключить события
// handler.unbindEvents();
И наконец, чтобы обернуть все в jQuery, вы можете использовать самовызывающуюся функцию.
(function($) {function Handler() {
// Остальной код
}
// Остальной код
var handler = new Handler();
handler.setOptions({ option1: 'value1', option2: 'value2' });
handler.bindEvents();
})(jQuery);
Этот код позволит вам создать расширяемый класс с возможностью переопределения методов и добавления/удаления событий внутри объекта Handler. Надеюсь, это поможет вам достичь необходимого функционала на JavaScript.