Javascript - Шаблонные литералы - Тернарная операция

Хорошо, поэтому я пытаюсь сделать следующее: у меня есть переменная isVisible, назначенная функции, которая определяет, какой элемент я прокручиваю, когда перемещаюсь по своей странице. Мне нужно использовать переменную isVisible для проверки и регистрации сообщения в зависимости от того, где я нахожусь на странице

Например, isVisible вверху страницы, журнал X, isVisible находится в середине страницы, журнал Y, isVisible находится внизу страницы, журнал Z.

isVisible - это функция, которая проверяет, где trgt находится на странице.

let isVisible = isScrolledIntoView(trgt);

console.log(`element index ${index} is now ${isVisible ? '"X"': (isVisible ? "Y" : "Z")}`);

Как бы мне это изменить, чтобы это имело смысл?


person mph85    schedule 17.06.2019    source источник
comment
Проверять isVisible дважды не имеет смысла, поскольку Y никогда не запустится. Вам понадобится другая переменная, которую вы там проверите.   -  person Yannick K    schedule 17.06.2019
comment
Обе ваши тернарии - первая и вложенная - используют isVisible в качестве проверки состояния ... Так что в основном вы получите только X или Z; Y недоступен ...   -  person Alexander Nied    schedule 17.06.2019
comment
Ах, как бы мне изменить его так, чтобы я мог получить 3 варианта, не знаю, как это сделать с помощью тернарного оператора   -  person mph85    schedule 17.06.2019
comment
Используя другую переменную для второго условного выражения.   -  person Yannick K    schedule 17.06.2019
comment
Тернарная форма хороша, но если у вас есть единственная условная проверка, она может быть только правдивой или ложной - она ​​не может представлять третье состояние. Использование двух условий позволит вам представить три (фактически четыре) разных состояния.   -  person Alexander Nied    schedule 17.06.2019
comment
Хорошо, поэтому я пытаюсь сделать следующее: у меня есть переменная isVisible, назначенная функции, которая определяет, какой элемент я прокручиваю, когда перемещаюсь по своей странице. Мне нужно использовать переменную isVisible для проверки и регистрации сообщения в зависимости от того, где я нахожусь на странице   -  person mph85    schedule 17.06.2019
comment
Например, isVisible вверху страницы, журнал X, isVisible находится в середине страницы, журнал Y, isVisible находится внизу страницы, журнал Z.   -  person mph85    schedule 17.06.2019
comment
Почему бы не использовать промежуточные переменные вместо того, чтобы заставить следующего разработчика, который взглянет на это, вырвать волосы, пытаясь понять, что вы делаете? Держите шаблон буквально поджарым.   -  person zero298    schedule 17.06.2019
comment
Я согласен, я бы хотел, чтобы это было как можно проще, просто не знаю, как использовать тернарный оператор, основанный на 3 условных выражениях.   -  person mph85    schedule 17.06.2019
comment
Я считаю, что точка @ zero298 в том, что не используйте тернарный оператор, основанный на трех условных выражениях - используйте тернарный оператор и вместо этого используйте if...else.   -  person Alexander Nied    schedule 17.06.2019
comment
ага, да, я, наверное, поменяю это   -  person mph85    schedule 17.06.2019


Ответы (2)


Если вы действительно хотите использовать тернарный оператор, вы можете назначить номер / строку для isVisible (который затем, вероятно, вы бы назвали как-то еще), а не логическим, и использовать visible = someNumber/someString в тернарном выражении:

const index = 1;
const visible = "bottom";

console.log(`element index ${index} is now ${visible === "top"
  ? '"X"' 
  : visible === "middle"
    ? "Y"
    : "Z"}`
);

Но, похоже, в вашем случае определенно предпочтительнее использовать оператор switch / if в сочетании с числами (или строками, если вы можете придумать четкие определения), если вам нужно больше позиций на вашей странице:

const index = 1;
const visible = 3;

switch (visible) {
  case 1:
    console.log( `Element index ${index} is now visible at A` );
    break;

  case 2:
    console.log( `Element index ${index} is now visible at B` );
    break;

  case 3:
    console.log( `Element index ${index} is now visible at C` );
    break;

  case 4:
    console.log( `Element index ${index} is now visible at D` );
    break;

  default:
    console.log( "Element is now in the void" );
    break;
}

person Yannick K    schedule 17.06.2019
comment
Цените это, я последовал вашему троичному примеру и получаю не только одно условное срабатывание. - person mph85; 17.06.2019

let checkStatement = isVisible === id-10 ? `Column with id ${id-10} started to become visible on the page` : isVisible === id-50  ? `Column with id  ${id-50} is now more than 50% visible on the page` : `Column with id ${id-40} is now fully visible on the page`

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

person Peter Abolude    schedule 17.06.2019
comment
Почему вы вставляете проверку условия в строку? - person Alexander Nied; 17.06.2019