То или это

Страница часто показывает либо одно, либо другое: билет бесплатный или с ценой, вечер — вечер открытия или вечер закрытия. С if и else понадобилась бы переменная:

let label;
if (band.day === "Пятница") {
    label = "Вечер открытия";
} else {
    label = "Вечер закрытия";
}

В JavaScript есть более короткая запись, условный оператор:

const label = band.day === "Пятница" ? "Вечер открытия" : "Вечер закрытия";

Читайте её как вопрос: верно ли, что band.day === "Пятница"? Если да, результат — значение после ?, если нет — значение после :. В нём три части, поэтому его ещё называют тернарным оператором. И в отличие от if, это выражение: оно даёт значение. Поэтому его можно поставить туда, где if нельзя, — в фигурные скобки JSX:

<p>{band.day === "Пятница" ? "Вечер открытия" : "Вечер закрытия"}</p>

Он может выбирать и атрибут, например классы элемента. В className можно записать несколько классов через пробел:

<article className={band.stage === "Главная сцена" ? "card big" : "card"}>

А ещё он может выбирать между двумя элементами: {band.headliner ? <strong>{band.name}</strong> : band.name}. Он хорош для коротких выборов между двумя значениями. Когда каждая ветка — несколько строк JSX, лучше читается if с ранним возвратом.

Типичная ошибка — забыть часть после :. Условному оператору всегда нужны оба значения. Для случая «это или ничего» есть более короткий способ, он в следующем упражнении.