Приемлемо ли такое исполнение модального окна на чистом JS?

Question

[Эмиль Рахматуллин]

Практикуюсь в JavaScript.
Приемлемо ли такое решение? Может, тут какие-то костыли? Или как можно сделать изящнее?

Modal window only JavaScript - CodePen

Comments

[twobomb]

На черное клацаю не закрывается, это не порядок!

[Эмиль Рахматуллин]

twobomb, ну это я не прописывал. Аналогия там почти та же. А что касается кода всё ок? Мне кажется он ненормальным. Привык к jQuery

[twobomb]

Эмиль Рахматуллин, Нормальный код, я видел хуже. Зачем только так писать
[].forEach.call(...
Можно же по человечески написать ну да ладно, сойдет я доволен.

[Эмиль Рахматуллин]

twobomb, стоило написать Array.prototype.forEach.call(...) или что с ним не так?)

[twobomb]

Эмиль Рахматуллин, Ну если так хочется forEach, то понятнее будет
Array.From(modals).forEach
На худой конец
[...modals].forEach

Answer 1

[Stalker_RED]

NodeList в современных браузерах поддерживает метод forEach, а для старых есть полифилл.
Если полифилл использовать почему-то нельзя или сложно, можно сконвертировать кнопки в массив сразу после того как вы их нашли, используя Array.from или более старый slice, например. Конструкция [].forEach.call... не нужна. Но если очень хочется, замените ее хотя-бы на Array.prototype.forEach.call... чтобы лишние массивы не создавать.

Перебирать все модалки при закрытии не нужно, можно закрыть текущую через closest().

Затемняющую подложку лучше не удалять из DOM, а скрывать стилями. Это быстрее, и меньше ресурсов потребляет.

backdoor - это черный ход. Не имеет никакого отношения к модальным окнам.

Чуток переписал, перебор элементов вообще не используется:

Comments

[Эмиль Рахматуллин]

Занавес. Круто!)

[Эмиль Рахматуллин]

IE 11- не поддерживает closest(). Получается, если нужна его поддержка, то мы делаем вот так?

if(!Element.prototype.closest)
{
  /* Вариант с closest() */
}
else
{
  /* Вариант с .forEach */
}

Верно?

[Stalker_RED]

Эмиль Рахматуллин, для ие подключается дополнительная js-ка с полифиллами

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