Задать вопрос
@Shimpanze
javascript

Как сократить такое условие?

Добрый день!

Как сократить такое условие?

if (
  ( element.previousSibling !== null && element.previousSibling.nodeName.toLowerCase() !== "h1" ) &&
  ( element.previousSibling !== null && element.previousSibling.nodeName.toLowerCase() !== "h2" ) &&
  ( element.previousSibling !== null && element.previousSibling.nodeName.toLowerCase() !== "h3" ) &&
  ( element.previousSibling !== null && element.previousSibling.nodeName.toLowerCase() !== "h4" ) &&
  ( element.previousSibling !== null && element.previousSibling.nodeName.toLowerCase() !== "h5" ) &&
  ( element.previousSibling !== null && element.previousSibling.nodeName.toLowerCase() !== "h6" ) &&
  ( element.previousSibling !== null && element.previousSibling.nodeName.toLowerCase() !== "p" ) &&
  ( element.previousSibling !== null && element.previousSibling.nodeName.toLowerCase() !== "img" )
) {}
  • Вопрос задан
  • 162 просмотра
Комментировать
Подписаться 2 Простой Комментировать
Решения вопроса 3
@mad_god
element.previousSibling !== null
вынести во внешнее условие,

element.previousSibling.nodeName.toLowerCase() сделать один раз перед проверкой
остальное - внутри

"h1", "h2", "h3", "h4", "h6", "p", "img"

можно сделать списком и проверять на вхождение в список
Ответ написан
1 комментарий
1 комментарий
xEpozZ
@xEpozZ
Веб-разработчик 
if (element.previousSibling !== null) {
    const lowerName = element.previousSibling.nodeName.toLowerCase();
    const tags = ['h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'p', 'img'];    
    if (!tags.includes(lowerName) {
        // ...
    }
}


Или так:
const tags = ['h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'p', 'img'];
if (element.previousSibling !== null && !tags.includes(element.previousSibling.nodeName.toLowerCase())) {    
    // ...
}


Но здесь уже вопрос читаемости. По мне 1 вариант лучше 2.
Ответ написан
5 комментариев
5 комментариев
@vladdimir
Верстальщик
Наверное можно и без сравнения с null, ведь условие преобразуется в логический тип, а null в js преобразуется в false:
if (element.previousSibling) { 
 // ... остальной код Дмитрия Дерепко
}

// Или без вложенных циклов
// сначала проверить:  если у элемента нет предшествующего элемента
if (!element.previousSibling) { 
  return element;  
  // вернуть элемент, чтобы другая функция что-то с ним могла сделать. 
  // Или вернуть false, не суть. Важно просто обработать сценарий, когда элемент 
  // идет первым в родителе. Можно просто выйти из функции.
}
// Дальше, если предшественник есть, делаем как в коде Дмитрия
const targetTags = ['h1', 'h2', ...],
    lowerName = element.previousSibling.nodeName.toLowerCase();

if (!targetTags.includes(lowerName)) { 
  // do samething
}

// Кстати, можно targetTags передавать сразу аргументом в функцию, чтобы код был чуть 
// более универсальным.
function doSomethingEpic(element, targetTargs) {
 // code
}

const someElem = document.querySelector('.epicElement');
const tags = ['h1', 'h2', ...],
doSomethingEpic(someElement, tags);


Важно: метод includes не поддерживается в IE, полифилл есть на сайте MDN
Ответ написан
2 комментария
2 комментария
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы
Вакансии с Хабр Карьеры
JavaScript разработчик
SummerWeb • Ярославль
от 100 000 до 140 000 ₽
JavaScript разработчик
вАйТи
от 5 000 до 25 000 ₽
JavaScript Fullstack
OnClass
от 200 000 до 600 000 ₽
Ещё вакансии
Заказы с Хабр Фриланса
Услуги devops разного характера для видео сервиса
26 апр. 2024, в 06:46
1000 руб./в час
Найти ошибку flutter_map
26 апр. 2024, в 05:31
1000 руб./за проект
Разработать электронику для весов с Wi-Fi
26 апр. 2024, в 01:22
1000 руб./в час
Ещё заказы