# Основи JavaScript: Прийняття рішень  > Скетчнот від [Tomomi Imura](https://twitter.com/girlie_mac) ## Тест перед лекцією [Тест перед лекцією](https://ff-quizzes.netlify.app/web/quiz/11) Прийняття рішень і контроль порядку виконання вашого коду робить його багаторазовим і надійним. У цьому розділі розглядається синтаксис для управління потоком даних у JavaScript і його значення при використанні з булевими типами даних. [](https://youtube.com/watch?v=SxTp8j-fMMY "Прийняття рішень") > 🎥 Натисніть на зображення вище, щоб переглянути відео про прийняття рішень. > Ви можете пройти цей урок на [Microsoft Learn](https://docs.microsoft.com/learn/modules/web-development-101-if-else/?WT.mc_id=academic-77807-sagibbon)! ## Короткий огляд булевих значень Булеві значення можуть мати лише два значення: `true` або `false`. Булеві значення допомагають приймати рішення про те, які рядки коду повинні виконуватися за певних умов. Встановіть булеве значення як true або false таким чином: `let myTrueBool = true` `let myFalseBool = false` ✅ Булеві значення названі на честь англійського математика, філософа та логіка Джорджа Буля (1815–1864). ## Оператори порівняння та булеві значення Оператори використовуються для оцінки умов шляхом порівняння, що створює булеве значення. Нижче наведено список операторів, які часто використовуються. | Символ | Опис | Приклад | | ------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------ | | `<` | **Менше ніж**: Порівнює два значення і повертає булеве значення `true`, якщо значення зліва менше, ніж справа | `5 < 6 // true` | | `<=` | **Менше або дорівнює**: Порівнює два значення і повертає булеве значення `true`, якщо значення зліва менше або дорівнює значенню справа | `5 <= 6 // true` | | `>` | **Більше ніж**: Порівнює два значення і повертає булеве значення `true`, якщо значення зліва більше, ніж справа | `5 > 6 // false` | | `>=` | **Більше або дорівнює**: Порівнює два значення і повертає булеве значення `true`, якщо значення зліва більше або дорівнює значенню справа | `5 >= 6 // false` | | `===` | **Строга рівність**: Порівнює два значення і повертає булеве значення `true`, якщо значення справа і зліва рівні і мають однаковий тип даних | `5 === 6 // false` | | `!==` | **Нерівність**: Порівнює два значення і повертає протилежне булеве значення тому, що повернув би оператор строгої рівності | `5 !== 6 // true` | ✅ Перевірте свої знання, написавши кілька порівнянь у консолі вашого браузера. Чи здивували вас якісь отримані дані? ## Оператор if Оператор if виконає код між своїми блоками, якщо умова є істинною. ```javascript if (condition) { //Condition is true. Code in this block will run. } ``` Логічні оператори часто використовуються для формування умови. ```javascript let currentMoney; let laptopPrice; if (currentMoney >= laptopPrice) { //Condition is true. Code in this block will run. console.log("Getting a new laptop!"); } ``` ## Оператор if..else Оператор `else` виконає код між своїми блоками, якщо умова є хибною. Він є необов’язковим для оператора `if`. ```javascript let currentMoney; let laptopPrice; if (currentMoney >= laptopPrice) { //Condition is true. Code in this block will run. console.log("Getting a new laptop!"); } else { //Condition is false. Code in this block will run. console.log("Can't afford a new laptop, yet!"); } ``` ✅ Перевірте своє розуміння цього коду та наступного коду, запустивши його в консолі браузера. Змініть значення змінних currentMoney і laptopPrice, щоб змінити результат `console.log()`. ## Оператор switch Оператор `switch` використовується для виконання різних дій залежно від різних умов. Використовуйте оператор `switch`, щоб вибрати один із багатьох блоків коду для виконання. ```javascript switch (expression) { case x: // code block break; case y: // code block break; default: // code block } ``` ```javascript // program using switch statement let a = 2; switch (a) { case 1: a = "one"; break; case 2: a = "two"; break; default: a = "not found"; break; } console.log(`The value is ${a}`); ``` ✅ Перевірте своє розуміння цього коду та наступного коду, запустивши його в консолі браузера. Змініть значення змінної a, щоб змінити результат `console.log()`. ## Логічні оператори та булеві значення Рішення можуть вимагати більше одного порівняння, і їх можна об’єднати за допомогою логічних операторів для отримання булевого значення. | Символ | Опис | Приклад | | ------ | ----------------------------------------------------------------------------------------- | ----------------------------------------------------------------------- | | `&&` | **Логічне І**: Порівнює два булеві вирази. Повертає true **лише**, якщо обидві сторони істинні | `(5 > 6) && (5 < 6 ) //Одна сторона хибна, інша істинна. Повертає false` | | `\|\|` | **Логічне АБО**: Порівнює два булеві вирази. Повертає true, якщо хоча б одна сторона істинна | `(5 > 6) \|\| (5 < 6) //Одна сторона хибна, інша істинна. Повертає true` | | `!` | **Логічне НЕ**: Повертає протилежне значення булевого виразу | `!(5 > 6) // 5 не більше ніж 6, але "!" поверне true` | ## Умови та рішення з логічними операторами Логічні оператори можна використовувати для формування умов у операторах if..else. ```javascript let currentMoney; let laptopPrice; let laptopDiscountPrice = laptopPrice - laptopPrice * 0.2; //Laptop price at 20 percent off if (currentMoney >= laptopPrice || currentMoney >= laptopDiscountPrice) { //Condition is true. Code in this block will run. console.log("Getting a new laptop!"); } else { //Condition is true. Code in this block will run. console.log("Can't afford a new laptop, yet!"); } ``` ### Оператор заперечення Ви вже бачили, як можна використовувати оператор `if...else` для створення умовної логіки. Усе, що потрапляє в `if`, має оцінюватися як true/false. Використовуючи оператор `!`, ви можете _заперечити_ вираз. Це виглядатиме так: ```javascript if (!condition) { // runs if condition is false } else { // runs if condition is true } ``` ### Тернарні вирази `if...else` — це не єдиний спосіб вираження логіки прийняття рішень. Ви також можете використовувати так званий тернарний оператор. Його синтаксис виглядає так: ```javascript let variable = condition ? : ``` Нижче наведено більш зрозумілий приклад: ```javascript let firstNumber = 20; let secondNumber = 10; let biggestNumber = firstNumber > secondNumber ? firstNumber : secondNumber; ``` ✅ Приділіть хвилину, щоб кілька разів прочитати цей код. Чи розумієте ви, як працюють ці оператори? У наведеному вище коді зазначено: - якщо `firstNumber` більше, ніж `secondNumber` - тоді присвоїти `firstNumber` змінній `biggestNumber` - інакше присвоїти `secondNumber`. Тернарний вираз — це просто компактний спосіб написання коду нижче: ```javascript let biggestNumber; if (firstNumber > secondNumber) { biggestNumber = firstNumber; } else { biggestNumber = secondNumber; } ``` --- ## 🚀 Виклик Створіть програму, яка спочатку написана з використанням логічних операторів, а потім перепишіть її, використовуючи тернарний вираз. Який синтаксис вам більше подобається? --- ## Тест після лекції [Тест після лекції](https://ff-quizzes.netlify.app/web/quiz/12) ## Огляд і самостійне навчання Дізнайтеся більше про численні оператори, доступні користувачеві, [на MDN](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Operators). Перегляньте чудовий [довідник операторів](https://joshwcomeau.com/operator-lookup/) від Джоша Комо! ## Завдання [Оператори](assignment.md) --- **Відмова від відповідальності**: Цей документ було перекладено за допомогою сервісу автоматичного перекладу [Co-op Translator](https://github.com/Azure/co-op-translator). Хоча ми прагнемо до точності, будь ласка, майте на увазі, що автоматизовані переклади можуть містити помилки або неточності. Оригінальний документ на його рідній мові слід вважати авторитетним джерелом. Для критичної інформації рекомендується професійний людський переклад. Ми не несемо відповідальності за будь-які непорозуміння або неправильні тлумачення, що виникають внаслідок використання цього перекладу.