Проверка типов

Umbrella JS — легковесная библиотека для работы с DOM и коллекциями элементов, предоставляющая удобные методы для манипуляции HTML-структурой. Одной из важных особенностей при работе с библиотекой является корректная проверка типов данных, чтобы гарантировать стабильность работы скриптов и предотвращение ошибок в рантайме.

Методы проверки типов

Umbrella JS не предоставляет собственных глобальных функций для проверки типов, однако библиотека встроена в экосистему JavaScript и полностью совместима с его стандартными инструментами:

  • typeof Используется для определения примитивных типов: строк, чисел, булевых значений, функций.

    u('div').each(el => {
      console.log(typeof el); // object
    });
  • Array.isArray() Проверка массивов особенно важна при работе с коллекциями элементов, возвращаемыми Umbrella JS, так как методы .map(), .each() и .filter() требуют итерабельного объекта.

    const elements = u('p');
    console.log(Array.isArray(elements)); // false, элементы Umbrella JS — не массив, а объект коллекции

    Для преобразования коллекции в массив используется метод toArray():

    const arrayElements = u('p').toArray();
    console.log(Array.isArray(arrayElements)); // true
  • instanceof Позволяет проверять принадлежность объекта к определённому классу или конструктору. В контексте Umbrella JS это полезно для проверки, является ли объект экземпляром коллекции u().

    const list = u('li');
    console.log(list instanceof u); // false, так как u() возвращает объект с прототипом Umbrella
    console.log(list instanceof Object); // true

Проверка наличия элементов

В Umbrella JS коллекция всегда возвращает объект, даже если элементов не найдено. Для проверки наличия элементов используется свойство length:

const items = u('.menu-item');
if (items.length > 0) {
    console.log('Элементы найдены');
} else {
    console.log('Элементы отсутствуют');
}

Это позволяет избежать ошибок при последующих манипуляциях, например вызове .addClass() или .html() на пустой коллекции.

Проверка типов атрибутов и значений

Методы работы с атрибутами и стилями в Umbrella JS требуют строгого соответствия типов:

  • attr() — возвращает строку, если атрибут существует, или undefined, если отсутствует.

    const input = u('#username');
    const value = input.attr('value');
    if (typeof value === 'string') {
        console.log('Значение атрибута:', value);
    }
  • css() — для получения стиля возвращает строку, для установки принимает строку или объект. Проверка типов помогает предотвратить ошибки при динамическом формировании стилей.

    const box = u('.box');
    const width = box.css('width');
    if (typeof width === 'string') {
        console.log('Ширина элемента:', width);
    }
    
    box.css({ height: '100px', backgroundColor: '#f00' });

Проверка коллбеков и функций

Umbrella JS широко использует коллбеки в методах .each(), .map(), .filter(). Проверка типа перед вызовом функции предотвращает ошибки:

const callback = item => console.log(item.text());
if (typeof callback === 'function') {
    u('li').each(callback);
}

Проверка Node и DOM элементов

Umbrella JS работает с объектами DOM, поэтому часто требуется проверка, является ли объект элементом:

const el = document.querySelector('div');
if (el instanceof HTMLElement) {
    u(el).addClass('highlight');
}

Это особенно полезно при работе с динамически создаваемыми элементами и смешанных типах данных.

Практика безопасной работы с коллекциями

  1. Всегда проверять наличие элементов через .length перед манипуляциями.
  2. Приводить коллекции к массиву через toArray() при необходимости стандартных методов массивов.
  3. Проверять типы атрибутов и стилей перед установкой значений.
  4. Контролировать типы коллбеков и функций, используемых в методах перебора.
  5. Использовать instanceof для проверки DOM элементов при взаимодействии с внешними API.

Заключение по типам в Umbrella JS

Строгая проверка типов обеспечивает надежную работу кода с библиотекой, предотвращает ошибки при манипуляциях с DOM и коллекциями элементов. Комбинация стандартных инструментов JavaScript (typeof, Array.isArray(), instanceof) и специфических методов Umbrella JS (length, toArray()) позволяет писать чистый и безопасный код, минимизируя неожиданные ошибки во время исполнения.