Оператори порівняння

Вітаємо на уроці про оператори порівняння. У програмуванні нам часто потрібно приймати рішення залежно від того, чи виконуються певні умови.

Наприклад, може знадобитися перевірити, чи користувач ввів правильний пароль, або чи він достатньо дорослий, щоб переглядати певний сайт. Для цього ми порівнюємо значення.

Що роблять оператори порівняння

Оператори порівняння — це спеціальні символи, які використовують для порівняння двох значень.

Кожного разу, коли ти використовуєш оператор порівняння, JavaScript перевіряє вираз і повертає булеве значення: true, коли порівняння відповідає значенням, або false, коли не відповідає.

= vs ===

Поширена помилка початківців — плутати один знак рівності (=) із трьома знаками рівності (===).

• Один знак = — це оператор присвоєння. Він присвоює значення змінній, наприклад: const age = 18;.
• Оператор === — це оператор строгої рівності. Він порівнює два значення, щоб перевірити, чи вони точно однакові за значенням і типом даних.

Коротке попередження: Іноді в старому коді можна побачити подвійний знак рівності (==) або не дорівнює (!=). Вони можуть заплутувати, бо JavaScript може спробувати перетворити типи даних перед порівнянням.

Для початківця краще використовувати === і !==, щоб отримувати безпечніші й передбачуваніші результати.

Перший приклад коду

Перевірмо, чи пароль, який ввів користувач, збігається зі збереженим паролем.

const savedPassword = "secretPassword123";
const enteredPassword = "secretPassword123";

console.log(savedPassword === enteredPassword);

const wrongPassword = "Password123";
console.log(savedPassword === wrongPassword);
console.log(savedPassword !== wrongPassword);

Пояснення коду

Коли ти натиснеш Запустити, результати з'являться в секції виводу.

• Перший console.log() виводить true, бо savedPassword і enteredPassword містять точно однаковий текст.
• Другий console.log() порівнює savedPassword з wrongPassword. Оскільки текст різний, JavaScript виводить false.
• Третій console.log() використовує !== і виводить true, бо ці два паролі різні.

Також є оператор строго не дорівнює (!==). Він перевіряє, чи два значення різні.

Порівняння чисел

Ми також можемо порівнювати числа, щоб дізнатися, яке з них більше або менше.

Ось поширені оператори для порівняння чисел:

• > означає більше ніж.
• < означає менше ніж.
• >= означає більше або дорівнює.
• <= означає менше або дорівнює.

Подивімося на практичний приклад із цінами та віком.

const itemPrice = 50;
const userBalance = 30;

// Чи може користувач оплатити товар?
console.log(userBalance >= itemPrice);

const age = 16;
const requiredAge = 18;

// Чи користувач молодший за потрібний вік?
console.log(age < requiredAge);

Міні-завдання

Спробуй відредагувати блок коду вище.

Зміни userBalance на 50 і натисни Запустити.

Чи перший результат змінюється на true? Оскільки 50 більше або дорівнює 50, умова виконується.

Короткий тест

Запитання: Що виведе console.log(10 !== 10)?

Відповідь: Він виведе false.

Оператор !== перевіряє, чи два значення строго не рівні. Оскільки 10 точно дорівнює 10, вираз 10 !== 10 є хибним.

Малий виклик

Уяви, що ти створюєш гру, де гравцю потрібно побити рекорд 100, щоб перемогти.

Створи змінну для рахунку гравця і використай оператор порівняння, щоб перевірити, чи його рахунок строго більший за рекорд.

// напиши свій код нижче

console.log()

Підсумок

• Оператори порівняння порівнюють два значення і завжди повертають true або false.
• = присвоює значення, а === перевіряє, чи два значення точно однакові.
• !== перевіряє, чи два значення не є точно однаковими.
• Використовуй >, <, >= і <=, щоб порівнювати числа, наприклад вік, баланс або рахунок у грі.