Как работает тернарный оператор в JavaScript?

Тернарный (условный) оператор в JavaScript — это компактная замена конструкции if...else для простых присваиваний или возврата значений. Он принимает три операнда.

Синтаксис:

условие ? выражение_если_истина : выражение_если_ложь

Как работает:

1. Вычисляется условие.
2. Если условие истинно (true), выполняется и возвращается результат выражения_если_истина.
3. Если условие ложно (false), выполняется и возвращается результат выражения_если_ложь.

Примеры:

// 1. Простое присваивание
const age = 20;
const status = age >= 18 ? 'Взрослый' : 'Ребёнок';
console.log(status); // "Взрослый"

// 2. Возврат значения из функции
function getFee(isMember) {
  return isMember ? '2.00$' : '10.00$';
}
console.log(getFee(true)); // "2.00$"

// 3. Вложенный тернарный оператор (используйте с осторожностью!)
const speed = 95;
const message = speed >= 120 ? 'Слишком быстро' :
                speed >= 80  ? 'Быстро' :
                'Нормально';
console.log(message); // "Быстро"

Ключевые особенности и best practices:

• Возвращает значение: Главное отличие от if...else — тернарный оператор всегда возвращает результат одного из выражений, что делает его идеальным для правой части присваивания или в return.
• Краткость: Упрощает код для простых условий.
• Не для side effects: Не следует использовать для выполнения действий (например, вызова функций с побочными эффектами) вместо возврата значения. Для этого лучше подходит if...else.
• Избегайте вложенности: Вложенные тернарные операторы (a ? b : c ? d : e) сильно снижают читаемость кода. В таких случаях явно используйте if...else if...else или switch.
• Приоритет: Тернарный оператор имеет очень низкий приоритет. Часто выражение с ним нужно заключать в круглые скобки, особенно при использовании в составе более сложного выражения.

// Без скобок может быть неочевидно
const x = 10;
const y = 20;
const result = x > 5 ? y > 15 ? 'A' : 'B' : 'C'; // Сложно читать

// Лучше с явными скобками или вообще избегать
const result2 = x > 5 ? (y > 15 ? 'A' : 'B') : 'C';