Доступ к методам экземпляра

Экземпляр Slim Select создаётся в момент инициализации и становится центральной точкой управления поведением компонента. Все последующие операции — выбор значения, управление состоянием, открытие/закрытие списка, поиск и изменение данных — выполняются через этот объект. Корректная организация доступа к экземпляру определяет предсказуемость работы интерфейса и упрощает сопровождение кода.

При создании селекта вызов конструктора возвращает объект экземпляра. Этот объект содержит весь публичный API компонента.

const slim = new SlimSelect({
  select: '#mySelect'
});

Переменная slim становится единственной точкой управления конкретным инстансом. В архитектуре с несколькими селектами каждый экземпляр должен храниться отдельно, поскольку Slim Select не предоставляет глобального менеджера инстансов.

const countrySelect = new SlimSelect({
  select: '#country'
});

const citySelect = new SlimSelect({
  select: '#city'
});

Каждый объект полностью изолирован и управляет только своим DOM-элементом.

Сохранение ссылки на экземпляр

Ключевая особенность работы с библиотекой — необходимость сохранять ссылку на экземпляр сразу при создании. Повторное получение инстанса из DOM напрямую не предусмотрено как основной сценарий.

Типичная ошибка — попытка обращаться к селекту через DOM-узел без сохранённого объекта управления. Правильный подход заключается в явном хранении ссылки:

const selects = {
  country: new SlimSelect({ select: '#country' }),
  city: new SlimSelect({ select: '#city' }),
  language: new SlimSelect({ select: '#language' })
};

Такой подход позволяет централизованно управлять всеми селектами, не теряя доступ к методам экземпляра.

Доступ к методам экземпляра

Экземпляр Slim Select предоставляет набор методов управления состоянием и поведением. Вызов методов осуществляется напрямую через сохранённую ссылку.

Получение выбранных значений

Метод получения текущего выбора возвращает массив значений или одиночное значение в зависимости от конфигурации.

const value = slim.getSelected();

Этот метод используется как основной источник состояния компонента, поскольку DOM-значение может быть синхронизировано с задержкой в зависимости от настроек.

Установка выбранного значения

Изменение текущего выбора выполняется через метод установки значения:

slim.setSelected('kz');

При мультивыборе передаётся массив:

slim.setSelected(['kz', 'ru', 'us']);

Метод полностью перезаписывает текущее состояние выбора, синхронизируя его с интерфейсом.

Управление состоянием активности

Экземпляр позволяет включать и отключать взаимодействие с селектом.

slim.disable();
slim.enable();

Отключённый компонент блокирует пользовательский ввод и взаимодействие со списком, но сохраняет текущее значение внутри состояния.

Управление выпадающим списком

Открытие и закрытие списка управляется программно без участия пользователя.

slim.open();
slim.close();

Эти методы особенно полезны при построении сложных интерфейсов, где поведение селекта зависит от внешних событий, например загрузки данных или валидации формы.

Поиск внутри списка

Метод поиска позволяет программно инициировать фильтрацию элементов:

slim.search('kaz');

Поиск влияет на отображаемые элементы внутри выпадающего списка и работает аналогично пользовательскому вводу в поле фильтрации.

Доступ через DOM-структуру

Slim Select создаёт собственную DOM-обёртку вокруг исходного <select> элемента. Несмотря на это, прямой доступ к экземпляру через DOM не является стандартным API, однако в некоторых конфигурациях библиотека может ассоциировать инстанс с элементом.

На практике корректный способ взаимодействия остаётся через сохранённую переменную, однако в архитектурах, где инициализация происходит динамически, применяется хранение ссылки в объекте состояния приложения:

document.querySelectorAll('select').forEach((el) => {
  el._slim = new SlimSelect({ select: el });
});

Такой подход позволяет связать DOM-элемент и экземпляр, но требует осторожности, поскольку использование приватных свойств не гарантируется библиотекой.

Управление экземпляром в динамических интерфейсах

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

let slimInstance = new SlimSelect({
  select: '#dynamic'
});

// обновление значения
slimInstance.setSelected('newValue');

// полное отключение
slimInstance.disable();

При удалении DOM-узла важно корректно уничтожить экземпляр, чтобы избежать утечек памяти и зависших обработчиков.

slimInstance.destroy();
slimInstance = null;

После вызова уничтожения все обращения к методам становятся недопустимыми.

Поведение после destroy

После удаления экземпляра объект теряет связь с DOM и внутренним состоянием. Любые вызовы методов после destroy() приводят к некорректной работе.

slimInstance.destroy();
slimInstance.setSelected('test'); // некорректно

Поэтому архитектурно важно обнулять ссылки и исключать повторное использование объекта.

Хранение нескольких экземпляров и маршрутизация доступа

При большом количестве селектов используется централизованное хранилище экземпляров. Это упрощает доступ к методам и предотвращает потерю ссылок.

const SlimRegistry = new Map();

function initSelect(id, selector) {
  const instance = new SlimSelect({ select: selector });
  SlimRegistry.set(id, instance);
}

initSelect('country', '#country');
initSelect('city', '#city');

Доступ к методам осуществляется через ключ:

SlimRegistry.get('country').setSelected('kz');
SlimRegistry.get('city').disable();

Такой подход особенно полезен в SPA-архитектурах, где компоненты могут перерисовываться без полного пересоздания страницы.

Ограничения доступа к экземпляру

Несмотря на наличие богатого API, экземпляр Slim Select остаётся относительно закрытой структурой. Он не предназначен для глубокой модификации внутренних данных напрямую. Все взаимодействия должны происходить через публичные методы.

Попытки изменения внутренних свойств объекта или DOM-структуры вне API могут привести к рассинхронизации состояния и визуального представления.

Контекст вызова методов

Методы экземпляра не требуют привязки контекста, поскольку не используются как независимые функции. Однако при передаче метода как колбэка может теряться связь с объектом.

const open = slim.open;
open(); // потенциально некорректно

Корректный вариант — сохранение вызова через обёртку:

const open = () => slim.open();
open();

Сценарии комбинированного использования методов

Методы экземпляра часто используются совместно для построения реактивного поведения интерфейса.

slim.disable();

fetch('/api/options')
  .then(res => res.json())
  .then(data => {
    slim.setData(data);
    slim.enable();
    slim.open();
  });

Такая последовательность позволяет управлять состоянием компонента в зависимости от внешних данных, обеспечивая синхронность UI и логики приложения.

Стабильность ссылки на экземпляр

Ссылка на экземпляр сохраняется стабильной до момента вызова destroy(). Это означает, что объект можно безопасно использовать в течение всего жизненного цикла компонента, не опасаясь его изменения со стороны библиотеки.

При повторной инициализации на том же DOM-элементе создаётся новый независимый экземпляр, который не связан с предыдущим.

Оглавление