Щоб умовно виконати логіку в JavaScript, найчастіше використовують умовну конструкцію.
Вона складається з ключового слова if, умови в круглих дужках і блоку коду у фігурних дужках.
Блок коду виконається, лише якщо умова набуде значення true.
if (condition) {
// code that is executed if "condition" is true
}
Її можна використовувати окремо або разом із ключовим словом else.
if (condition) {
// code that is executed if "condition" is true
} else {
// code that is executed otherwise
}
Щоб вкласти ще одну умову в блок else, можна скористатися else if.
Зауважимо, що в JavaScript немає ключового слова elseif.
Замість цього пишемо else, а після нього ще одну умовну конструкцію.
if (condition1) {
// code that is executed if "condition1" is true
} else if (condition2) {
// code that is executed if "condition2" is true
// but "condition1" was false
} else {
// code that is executed otherwise
}
Теоретично можна вкласти скільки завгодно додаткових умов.
На практиці в таких випадках краще скористатися конструкцією switch.
if (condition1) {
// ...
} else if (condition2) {
// ...
} else if (condition3) {
// ...
} else if (condition4) {
// ...
} else {
// ...
}
Складаючи складні умови, варто звернутися до таблиці пріоритету операторів, щоб уникати зайвих дужок.
if (num >= 0 && num < 1) {
// ...
}
// The inner brackets are obsolete because relational operators
// have higher precedence than logical operators.
<!-- prettier-ignore-start -->
if ((num >= 0) && (num < 1)) {
// ...
}
<!-- prettier-ignore-end -->
Також варто подумати про додаткові змінні, щоб код було легше читати.
const isPositive = num >= 0;
const isSmall = num < 1;
if (isPositive && isSmall) {
// ...
}
У JavaScript умова не обовʼязково має бути булевим значенням (англ. Boolean). Якщо в булевому контексті, наприклад в умовній конструкції, опиниться значення будь-якого іншого типу, JavaScript неявно перетворить його на булеве значення. Про те, які значення є truthy, а які falsy, докладніше розповідає концепція перетворення типів.
const num = 4;
if (num) {
// this code block will be executed because 4 is truthy
}
Якщо в блоці коду для if або else потрібно виконати лише одну інструкцію, у JavaScript можна опустити фігурні дужки.
if (condition) doSomething();
// or
if (condition)
doSomething();
Іноді так роблять, наприклад, щоб перевірити, чи не сталася помилка. Загалом це не рекомендується, бо легко забути повернути дужки, коли додаємо другу інструкцію, яка має залежати від тієї самої умови.
Коли ми пишемо функції, часто вдаються до такого прийому: опустити блок else й натомість використати достроковий return у блоці if.
У багатьох випадках це зменшує вкладеність, а код стає зрозумілішим і його легше читати.
function checkNumber(num) {
let message = '';
if (num === 0) {
message = 'You passed 0, please provide another number.';
} else {
message = 'Thanks for passing such a nice number.';
}
return message;
}
// Can also be written as ...
function checkNumber(num) {
if (num === 0) {
return 'You passed 0, please provide another number.';
}
return 'Thanks for passing such a nice number.';
}