В каких местах лучше заменить код для дальнейшей адаптации на любой проект?

Question

[Игорь]

Сделал себе небольшие табы как наработку для использования в дальнейших проектах, но как по мне код получился достаточно большим для такой маленькой задачи.
Буду очень благодарен если вы укажите на какие-то части которые можно заменить или лучше сделать по другому для более простой кастомизации? На апдаптив не смотрите пока :)

Answer 1

[Ihor Bratukh]

(function () {
    'use strict';

    const myTab = function (selector, options) {
        const setting = Object.assign({
            // параметры по умолчанию
        }, options || {});

        // код логики табов

    };

    // Цепляем функцию плагина на глобальный объект
    window.myTab = myTab;

}());

//> Инициализируем плагин
window.myTab('.my-tab-selector', {
    active: 'active-item',
    content: 'tab-item-content',
    tabs: '.tabs',
    onChange: function (tab) {
        console.log('Таб переключили')
    }
});

Comments

[Игорь]

Не могли бы вы, пожалуйста пояснить более детально чем такой способ лучше?
Я не очень опытен в javascript и сейчас его изучаю, хотелось бы изначально понимать что лучше и почему:)

[Ihor Bratukh]

Игорь, модульность. Делаете такой плагин в отдельном файле и подключаете во все нужные проекты.
Кастомные параметры плагина подойдут для любой структуры верстки и не будет привязанности к конкретным наименованиям CSS классов. Возможность использовать много раз на странице.

[Игорь]

BRAGA96, Привет, вернулся к этой задаче, немного запутался

const myTab = function (selector, options) {
        const setting = Object.assign({
            // параметры по умолчанию
        }, options || {});

        // код логики табов

    };

    // Цепляем функцию плагина на глобальный объект
    window.myTab = myTab;

что происходит в данной части?
и как я бы мог адаптировать это под себя, неверно будет использовать переменные с ориентировкой на классы или id, верно?