13 KiB

Raw Blame History Unescape Escape

Основи JavaScript: Прийняття рішень

Скетчнот від Tomomi Imura

Тест перед лекцією

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

🎥 Натисніть на зображення вище, щоб переглянути відео про прийняття рішень.

Ви можете пройти цей урок на Microsoft Learn!

Короткий огляд булевих значень

Булеві значення можуть мати лише два значення: 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 виконає код між своїми блоками, якщо умова є істинною.

if (condition) {
  //Condition is true. Code in this block will run.
}

Логічні оператори часто використовуються для формування умови.

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.

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, щоб вибрати один із багатьох блоків коду для виконання.

switch (expression) {
  case x:
    // code block
    break;
  case y:
    // code block
    break;
  default:
  // code block
}

// 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.

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. Використовуючи оператор !, ви можете заперечити вираз. Це виглядатиме так:

if (!condition) {
  // runs if condition is false
} else {
  // runs if condition is true
}

Тернарні вирази

if...else — це не єдиний спосіб вираження логіки прийняття рішень. Ви також можете використовувати так званий тернарний оператор. Його синтаксис виглядає так:

let variable = condition ? <return this if true> : <return this if false>

Нижче наведено більш зрозумілий приклад:

let firstNumber = 20;
let secondNumber = 10;
let biggestNumber = firstNumber > secondNumber ? firstNumber : secondNumber;

✅ Приділіть хвилину, щоб кілька разів прочитати цей код. Чи розумієте ви, як працюють ці оператори?

У наведеному вище коді зазначено:

якщо firstNumber більше, ніж secondNumber
тоді присвоїти firstNumber змінній biggestNumber
інакше присвоїти secondNumber.

Тернарний вираз — це просто компактний спосіб написання коду нижче:

let biggestNumber;
if (firstNumber > secondNumber) {
  biggestNumber = firstNumber;
} else {
  biggestNumber = secondNumber;
}

🚀 Виклик

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

Тест після лекції

Огляд і самостійне навчання

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

Перегляньте чудовий довідник операторів від Джоша Комо!

Завдання

Оператори

Відмова від відповідальності:
Цей документ було перекладено за допомогою сервісу автоматичного перекладу Co-op Translator. Хоча ми прагнемо до точності, будь ласка, майте на увазі, що автоматизовані переклади можуть містити помилки або неточності. Оригінальний документ на його рідній мові слід вважати авторитетним джерелом. Для критичної інформації рекомендується професійний людський переклад. Ми не несемо відповідальності за будь-які непорозуміння або неправильні тлумачення, що виникають внаслідок використання цього перекладу.

13 KiB Raw Blame History Unescape Escape