Контекст выполнения

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

Основная идея контекста

Контекстом считается набор выбранных DOM-элементов, обёрнутых в объект u(...). Почти каждый метод библиотеки возвращает этот же объект, что создаёт цепочку операций над одним и тем же набором узлов. При этом ключевым элементом становится не изменение глобального состояния, а аккуратное преобразование доменной коллекции.

Пример базового выбора элементов:

u('.item')       // формируется контекст из всех элементов с классом .item

Данный вызов создаёт внутреннюю коллекцию элементов, к которой могут быть применены последующие методы (addClass, attr, find и многие другие).

Преобразование контекста

При вызове методов, способных изменить набор элементов, контекст переопределяется:

u('ul').find('li')

Метод find находит дочерние элементы li и формирует новый контекст. Предыдущий набор (ul) при этом не уничтожается концептуально, но не участвует в дальнейших вызовах цепочки.

Важно подчеркнуть: методы Umbrella JS не изменяют DOM-коллекции напрямую вне текущего контекста, который выступает ядром цепочки выполнения.

Сохранение ссылочной целостности

Методы, не меняющие состав контекста, возвращают ту же коллекцию элементов. Это относится к:

  • addClass
  • removeClass
  • toggleClass
  • attr (установка)
  • css (установка)
  • html (установка)
  • on и off

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

u('.item')
  .addClass('active')
  .css({ color: 'red' })

Каждый метод продолжает работу в контексте .item.

Извлечение данных из контекста

Для получения значений существуют методы, разрывающие цепочку и возвращающие не сам контекст, а данные. Это может быть:

  • html() без параметров
  • text() без параметров
  • attr(name) без параметров
  • first() или last(), когда требуется один элемент, а продолжение цепочки уже логически не имеет смысла
const text = u('.item').first().text()

Здесь text() возвращает строку, а не коллекцию, поэтому дальнейший вызов методов Umbrella JS невозможен.

Контекст и метод each

Особый интерес представляет each, который исполняет функцию для каждого элемента контекста:

u('.item').each(function(node, i) {
  node.dataset.index = i
})

Функция выполняется в стандартизированном окружении: параметр node — это конкретный DOM-узел, i — индекс. Возвратом each вновь становится исходный контекст, что позволяет продолжать цепочку.

Вложенные контексты и подвыборки

Комбинация find и filter создаёт вложенные цепочки выбора, формируя локальные подмножества узлов:

u('.list')
  .find('li')
  .filter('.active')
  .addClass('highlight')

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

Завершающий контекст и интеграция с DOM

Umbrella JS не создаёт абстракций над DOM глубже, чем необходимо. Контекст выступает тонкой оболочкой над NodeList, но обеспечивает:

  • лаконичную обработку;
  • минимальное потребление памяти;
  • предсказуемое управление порядком вызовов;
  • отсутствие скрытых побочных эффектов.

Эта модель контекста делает цепочки методов Umbrella JS близкими по духу к jQuery, но с более строгой минималистичной архитектурой и меньшим количеством магии.

Контекст как единица выполнения

Контекст Umbrella JS можно рассматривать как единицу выполнения цепочки операций, в которой:

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

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