Использование инлайнового if-else в JavaScript: примеры и синтаксис

Быстрый ответ

Тернарный оператор в JavaScript предоставляет возможность проведения быстрых логических проверок прямо на месте. Вот его общая схема: (условие) ? значениеIfTrue : значениеIfFalse.

let access = age >= 18 ? 'Взрослый' : 'Не совершеннолетний';

Такой подход позволяет оптимизировать код, преобразуя блок if-else в одну строку.

Мощь тернарного оператора

Тернарный оператор в JavaScript — это настоящая находка для всех, кто ценит ясность и лаконичность кода. Он идеально подходит для быстрых проверок, которые ведут к одному из двух возможных исходов, в результате упрощая код и усиливая его читабельность.

Рассмотрим обычный блок if-else:

let access;
if (age >= 18) {
  access = 'Взрослый';
} else {
  access = 'Не совершеннолетний';
}

Тернарный оператор JavaScript позволяет добиться то же самое, но с существенно меньшим количеством кода:

let access = age >= 18 ? 'Взрослый' : 'Не совершеннолетний';

Истинность в JavaScript

Важно освоить понятия истинности и логических операторов для управления потоком выполнения в JavaScript.

let canVote = (age !== null) && age >= 18;

В этом случае canVote будет true, если age не равен null и age больше или равно 18. Иными словами, голосовать можно, если указан возраст и он 18 и больше.

Логика работы с операторами

Иногда необходимо выполнить проверку if, без привязки к else. В подобных ситуациях логические операторы, такие как && (И) и || (ИЛИ), становятся незаменимыми.

let visibility = isLoggedIn && hasPermission;

В этом случае visibility примет значение isLoggedIn, если оно ложно; в случае истинности — значение hasPermission.

Визуализация

Выбор обуви зависит от погодных условий:

Погода сегодня: ☀️ или 🌧️ ?

Решение можно сформулировать через тернарный оператор:

let shoes = weather === 'sunny' ? '👟' : '🥾';

Это аналогично реакции на светофор 🚦:

Зелёный свет (☀️): Одеваем кроссовки 👟
Красный свет (🌧️): Выбираем ботинки 🥾

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

Привлечение вложенных тернарных операторов иногда бывает уместным, но влечёт за собой ухудшение читаемости кода:

let greeting = isMorning 
  ? 'Доброе утро' 
  : (isEvening ? 'Добрый вечер' : 'Привет');

Если условий становится слишком много, стоит рассмотреть использование блоков if-else.

Применение одиночного if-выражения инлайн

Если вам необходимо аккуратно использовать однострочное if, можно отказаться от фигурных скобок:

if (exists) performMagic();

Вопрос производительности

Хоть тернарный оператор и приводит к упрощению кода, не стоит ожидать от него существенного прироста производительности. Современные JavaScript-движки хорошо оптимизированы, поэтому влияние будет минимальным. Важнее всего стремиться к чистоте и читаемости кода.

Полезные материалы

1. Условный (тернарный) оператор – JavaScript | MDN: Детализированная информация о всех нюансах тернарного оператора на MDN.
2. Условная конструкция: if, '?': Обстоятельный обзор условных переходов с использованием if и оператора ? в JavaScript.
3. JavaScript if else else if: Интерактивный ресурс для практического изучения условных конструкций в JavaScript.
4. Официальные спецификации ECMAScript® 2021: Техническая спецификация тернарного оператора в соответствии со стандартом ECMAScript.
5. Как использовать оператор ? : (тернарный) в JavaScript? – Stack Overflow: Обсуждение практических примеров и советы по использованию тернарных операторов.
6. Как работает оператор вопросительного знака (?) в JavaScript: Подробное объяснение функционала тернарного оператора с примерами.
7. Изучаем JavaScript на Codecademy: Интерактивный курс для освоения условных конструкций, включая тернарный оператор в JavaScript.