Тернарный оператор

Урок: Тернарный оператор

Введение

Представь, что у тебя есть простая задача: если пользователь авторизован — показать его имя, если нет — показать «Гость». Или если возраст больше 18 — вывести «взрослый», иначе — «ребёнок».

Мы уже знаем, что такие задачи решаются через if / else. Но иногда условие очень простое, и писать целый блок if выглядит громоздко.

В таких случаях появляется более компактный способ — тернарный оператор.

Он позволяет записать простое условие в одну строку. Это не новый тип логики, а просто более краткая форма записи привычного if / else.

Важно понимать: тернарный оператор — это не замена if, а инструмент для тех случаев, где условие простое и читаемое.

Как выглядит тернарный оператор

Общий вид тернарного оператора выглядит так:

условие ? значение_если_true : значение_если_false;

Ниже — исполняемый вариант общего вида: в JavaScript допустимы идентификаторы на кириллице, имена совпадают с формулой в text выше:

const условие = true;
const значение_если_true = 'если истина';
const значение_если_false = 'если ложь';

console.log(условие ? значение_если_true : значение_если_false);

На первый взгляд запись с ? и : может быть непривычной, но если разобрать по частям, всё становится понятно.

Рассмотрим привычный пример с возрастом:

let age = 20;

let result = age >= 18 ? 'Взрослый' : 'Ребёнок';

console.log(result);

Здесь происходит следующее:

  • сначала проверяется условие age >= 18;
  • если оно истинно (true) — возвращается "Взрослый";
  • если ложно (false) — возвращается "Ребёнок".

Результат записывается в переменную result.

По сути, это короткая форма такого кода (возраст тот же, что в примере выше — каждый блок в теории выполняется отдельно, поэтому age объявляем снова):

let age = 20;
let result;

if (age >= 18) {
  result = 'Взрослый';
} else {
  result = 'Ребёнок';
}

console.log(result);

Почему он называется «тернарный»

Слово «тернарный» означает, что оператор работает с тремя частями:

  1. условие
  2. значение, если условие истинно
  3. значение, если условие ложно

Это отличает его от обычных операторов, которые работают с двумя значениями.

Использование в переменных

Тернарный оператор чаще всего используется при присвоении значения.

let isLoggedIn = true;

let message = isLoggedIn ? 'Добро пожаловать' : 'Пожалуйста, войдите';

console.log(message);

Здесь мы сразу получаем нужное значение без отдельного if.

Это делает код компактнее и иногда более читаемым.

Использование внутри выражений

Тернарный оператор можно использовать прямо внутри других выражений.

let price = 100;
let discount = true;

let finalPrice = discount ? price * 0.9 : price;

console.log(finalPrice);

Если есть скидка, цена уменьшается на 10%, иначе остаётся прежней.

Здесь важно понять: тернарный оператор возвращает значение, а не просто выполняет код.

Несколько условий подряд

Иногда встречается вложенный тернарный оператор:

let score = 75;

let result = score >= 90 ? 'Отлично' : score >= 70 ? 'Хорошо' : 'Плохо';

console.log(result);

Этот код работает, но становится сложнее для чтения.

Происходит следующее:

  • если score >= 90 → "Отлично"
  • иначе проверяется score >= 70
  • если да → "Хорошо"
  • иначе → "Плохо"

Такие конструкции лучше использовать осторожно, потому что они быстро становятся запутанными.

Когда стоит использовать тернарный оператор

Тернарный оператор хорошо подходит, когда:

  • условие простое и короткое;
  • нужно сразу получить значение;
  • нет сложной логики внутри блоков.

Например:

let userName = null;
let name = userName ? userName : 'Гость';

console.log(name);

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

Но если логика становится сложной, лучше использовать обычный if.

Когда лучше не использовать

Рассмотрим пример:

let age = 20;

age >= 18 ? console.log('Доступ разрешён') : console.log('Доступ запрещён');

Технически это работает, но читается хуже, чем обычный if.

Тернарный оператор лучше использовать для возврата значения, а не для выполнения действий.

Где это используется на практике

Тернарный оператор часто используется в интерфейсах.

Например:

  • показать текст в зависимости от состояния;
  • изменить класс элемента;
  • выбрать значение по умолчанию;
  • быстро обработать простую логику.

Он особенно популярен в React и других библиотеках, где важно писать компактный код внутри выражений.

Итоговое понимание

Тернарный оператор — это краткая форма записи условия if / else, которая возвращает значение.

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

Главная идея — использовать его там, где логика проста и читаема. Если код начинает выглядеть сложным, значит лучше вернуться к обычным условиям.

Тернарный оператор — это инструмент удобства, а не универсальное решение.