Каков наилучший способ установить переменную с помощью оператора if, else if, else

0

Должен быть лучший способ установить переменную $ callLinkContainer в следующем блоке кода:

var $callLinkContainer;
if ( $callLink.closest('class1-tel').length > 0 ) {
     $callLinkContainer = $('body').find('.class1-container');
} else if ( $callLink.closest('.class2').length > 0 ) {
     $callLinkContainer = $('body').find('.class2-container');
} else {
     $callLinkContainer = $callLink.closest('.class3');
}

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

  • 0
    Зачем вам нужен $('body').find(...) в первых двух назначениях?
  • 0
    Это просто фрагмент гораздо большего кода. Я в основном ищу атрибуты данных в контейнерах ссылок и устанавливаю переменную в это значение.
Теги:

4 ответа

1
Лучший ответ

Вы можете вложить условные операторы. Код короче и с соответствующими разрывами строк и отступом он читается как инструкции if.

$callLinkContainer = $callLink.closest('class1-tel').length ?
    $('.class1-container') :
    ($callLink.closest('.class2').length ?
        $('.class2-container') :
        $callLink.closest('.class3'));
  • 0
    FWIW, вы можете удалить > 0 с
  • 0
    Вы можете безопасно разбить это на несколько строк, чтобы улучшить читаемость - вывод с запятой не помешает.
Показать ещё 7 комментариев
2

Вы можете использовать несколько тернарных операторов с отступом

var $callLinkContainer = $callLink.closest('class1-tel').length > 0 
  ? $('body').find('.class1-container')
  : $callLink.closest('.class2').length > 0 
    ? $('body').find('.class2-container')
    : $callLink.closest('.class3');

Приоритет операторов заключается в том, что вам не нужно добавлять скобки, как в

a ? b : (c ? d : e)

Однако вы можете добавить их для большей ясности.

0

Я хотел бы сделать следующее предложение

  1. Инкапсулировать код в несколько функций

    function isCallLinkClosest(var callLinkSelector){ 
        return $callLink.closest(callLinkSelector).length > 0;
    }
    
    function getCallLinkContainer(var containerSelector){
        return $('body').find(containerSelector);
    }
    
    function getDataAttributeByClass(){ 
        if ( isCallLinkClosest('class1-tel')) {
         return getCallLinkContainer('.class1-container');
        } else if ( isCallLinkClosest('.class2')) {
         return getCallLinkContainer('.class2-container');
        } else {
         return $callLink.closest('.class3');
        }
    }
    

Это лучшее предложение, которое я могу сделать с данной информацией :)

0

.class1-tel ли .class1-tel, .class2 или .class3 одновременно?
Если нет, то вы можете сделать что-то вроде этого:

var $callLinkContainer = ($callLink.closest('.class1-tel, .class2').length
    ? $('body').find('.class1-container, .class2-container')
    : $callLink.closest('.class3'));

Если вы можете быть более конкретными в отношении имен классов и структуры dom, код может быть еще проще.

Ещё вопросы

Сообщество Overcoder
Наверх
Меню