Нужно ли использовать нативный JS с ООП на простом проекте вместо jQ?

Нужно ли использовать нативный JS с ООП на простом проекте вместо jQ?

Есть простой код на jQ

$('.header-other').click(function(){
    $('.other-menu').toggleClass('open');
});

По клику на элемент header-other, скрывается или отображается меню.

Хотел переписать на натив ООП. Получилось вот такое:

document.addEventListener('DOMContentLoaded', () => {

    class HeaderOther {

        constructor(selector){

            this.$el = document.querySelector(selector);
            this.$otherMenu = document.querySelector('.other-menu');

            this.#setup();
        }

        #setup() {
            this.clickHandler = this.clickHandler.bind(this);
            this.$el.addEventListener('click', this.clickHandler);
        }

        clickHandler(event) {
            this.toggle();
        }

        get isOpen() {
            return this.$el.classList.contains('open');
        }

        toggle() {
            this.isOpen ? this.close() : this.open();
        }

        open() {
            this.$el.classList.add('open');
        }

        close() {
            this.$el.classList.remove('open');  
        }

    } // HeaderOther

    new HeaderOther('.header-other');

});

Первый вопрос, правильно ли переписал? Второй, нужно ли... кажется пара строк против целой кучи )

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


Ответы (0 шт):