Elementor Header #8

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

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

Синтаксис тернарного оператора

Тернарный оператор в JavaScript выглядит следующим образом:

				
					условие ? выражение1 : выражение2;

				
			
  • условие — выражение, которое возвращает true или false.
  • выражение1 — выполняется, если условие истинно (true).
  • выражение2 — выполняется, если условие ложно (false).

Пример использования тернарного оператора

Рассмотрим пример, в котором нужно присвоить переменной status значение в зависимости от возраста пользователя:

				
					let age = 18;
let status = age >= 18 ? "Взрослый" : "Несовершеннолетний";
console.log(status); // "Взрослый"

				
			

В этом примере:

  • Если возраст пользователя 18 лет или больше, переменной status присваивается значение «Взрослый».
  • В противном случае переменной status присваивается значение «Несовершеннолетний».

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

Тернарный оператор проверяет условие:

  • Если условие истинно, он выполняет первое выражение (после знака ?).
  • Если условие ложно, он выполняет второе выражение (после знака :).

Тернарный оператор возвращает значение, которое можно сразу присвоить переменной или использовать в другом выражении.

Вложенные тернарные операторы

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

Пример:

				
					let score = 85;
let grade = score >= 90 ? "A" :
             score >= 75 ? "B" :
             score >= 60 ? "C" : "F";

console.log(grade); // "B"

				
			

В этом примере:

  • Если score больше или равно 90, возвращается «A».
  • Если score больше или равно 75, но меньше 90, возвращается «B».
  • Если score больше или равно 60, но меньше 75, возвращается «C».
  • Если ни одно из условий не выполняется, возвращается «F».

Важные замечания

  • Читаемость кода: Тернарный оператор удобен для простых условий, но при вложении нескольких операторов код может стать трудным для понимания. В таких случаях лучше использовать обычную конструкцию if-else.

  • Использование с осторожностью: Тернарный оператор часто используется для присваивания значений переменным, но не рекомендуется использовать его для выполнения сложных логических операций, так как это может запутать код.

Распространённые ошибки

Пропуск одной из частей тернарного оператора:

Ошибка: Пропуск выражения после : приводит к синтаксической ошибке.

				
					let age = 20;
let status = age >= 18 ? "Взрослый" : ; // Ошибка

				
			

Исправление: Убедитесь, что обе части тернарного оператора (выражение1 и выражение2) присутствуют.

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

				
			

Сложные условия в тернарном операторе:

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

				
					let x = 10, y = 5;
let result = x > y ? x - y > 3 ? "Большая разница" : "Маленькая разница" : "x не больше y";

				
			

Исправление: Разделите сложное условие на несколько строк или используйте конструкцию if-else.

				
					let x = 10, y = 5;
let result;

if (x > y) {
    result = (x - y > 3) ? "Большая разница" : "Маленькая разница";
} else {
    result = "x не больше y";
}

				
			

Заключение

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

Тестовое задание

  • Напишите скрипт, который присваивает переменной isAdult значение true, если возраст пользователя (age) 18 лет или больше, и false в противном случае.

Исправьте следующую ошибку в коде:

				
					let temperature = 30;
let weather = temperature > 25 ? "Жарко" ? "Тепло";

				
			
  • Какой результат будет выведен?
  • Как правильно исправить код?

Напишите программу, которая принимает на вход число и выводит «Положительное», если число больше нуля, и «Отрицательное» или «Ноль», если число меньше или равно нулю. Используйте тернарный оператор для решения задачи.

Реализуйте функцию, которая принимает на вход два числа и возвращает строку «Первое больше», если первое число больше второго, «Второе больше», если второе число больше первого, и «Оба равны», если числа равны. Используйте тернарный оператор для определения результата.

				
					function compareNumbers(num1, num2) {
    // Ваш код здесь
}

console.log(compareNumbers(5, 10)); // Ожидаемый вывод: "Второе больше"
console.log(compareNumbers(20, 10)); // Ожидаемый вывод: "Первое больше"
console.log(compareNumbers(7, 7));   // Ожидаемый вывод: "Оба равны"

				
			

Напишите функцию discount, которая принимает цену товара (price) и возвращает строку «Скидка 10%» если цена больше 1000, «Скидка 5%» если цена от 500 до 1000, и «Без скидки» если цена меньше 500. Используйте тернарный оператор для определения скидки.

				
					function discount(price) {
    // Ваш код здесь
}

console.log(discount(1500)); // Ожидаемый вывод: "Скидка 10%"
console.log(discount(800));  // Ожидаемый вывод: "Скидка 5%"
console.log(discount(300));  // Ожидаемый вывод: "Без скидки"

				
			

Исправьте ошибку в следующем коде:

				
					let hour = 14;
let timeOfDay = hour < 12 ? "Утро" : hour < 18 ? "День" : hour < 22 ? "Вечер";
console.log(timeOfDay); // Ожидаемый вывод: "День"

				
			
  • Почему результат может быть неожиданным?
  • Какой результат будет выведен при значении hour равном 14?
  • Как правильно исправить код, чтобы результат был корректным для всех случаев суток?

Решите все задания, чтобы практиковаться в использовании тернарного оператора и избегать распространённых ошибок.

logo