У JavaScript є оператори if та then, а також тернарний оператор, які дозволяють нам робити певні речі лише за дотримання деяких умов. JavaScript визначає, чи є умова виконаною, оцінюючи значення чи вираз з його «істинність». Оскільки JavaScript відноситься до динамічно типованих мов, ми можемо використовувати будь-яке значення або їхню комбінацію. Однак правила, за якими JavaScript визначає, чи є дане значення або вираз true або false можуть заплутати.
Ось приклад простого вираження if у JavaScript. У ньому оцінюється на істину число 1; оскільки 1 істинно, код всередині блоку, обмежений { і }, буде виконано.
<code data-language="javascript">if ( 1) { //цей код буде виконано! console.log( '1 — істина'); }Як з'ясовується, більшість значень у JavaScript є істинними — насправді лише п'ять значень у JavaScript помилкові:
- undefined (значення за промовчанням оголошених змінних, яким не надано значення);
- null;
- NaN (not a number, не число);
- 0 (нуль);
- '' (порожній рядок).
Коли ми хочемо перевірити, чи є значення «хибно», то можемо використовувати оператор !:
<code data-language="javascript">var a=''; if ( !a) { //цей код буде виконаний якщо a хибно console.log( 'a — хибно'); }NaN це особливий випадок. Значення, які NaN оцінюватиме на брехню, в простому умовному вираженні:
<code data-language="javascript">var notANumber='four' — 'five'; if ( !notANumber) { //цей код буде виконано console.log( '!notANumber — істинно'); }Проте, якщо ми порівняємо значення NaN з false, то повернемося до помилкового значення:
<code data-language="javascript">var notANumber='four' — 'five'; if ( notANumber==false) { //цей код не буде виконано! console.log('notANumber — хибно'); }
else { //цей код буде виконаний console.log( 'notANumber — істинно'); }Важливо пам'ятати, що всі інші значення, крім п'яти перерахованих вище, є істинними. Сюди входять порожні масиви, порожні об'єкти, всі непусті рядки (у тому числі рядок '0') та будь-які числа крім 0. Можна написати вираз із if та else в один рядок без використання фігурних дужок. Ця практика не рекомендується, оскільки ускладнює читання коду та його підтримку. Ми згадали про це просто тому, що ви можете зіткнутися з цим у чужому коді.">&&) та АБО (||).
<code data-language="javascript">var foo=1; var bar=0; var baz=2; foo || bar; //Повертає 1, яке істинно bar | foo; //повертає 1, яке істинно foo && bar; //повертає 0, яке помилково foo && baz; //повертає 2, яке є істинним
У випадку оператора || повертається перше значення, якщо воно істинне, або останнє значення. У випадку оператора && повертається перше значення, якщо воно помилкове, або останнє значення.
Іноді ви можете побачити логічні оператори, які використовуються як хитрий спосіб. виконання коду:
<code data-language="javascript">foo && bar(); //виконує bar() тільки якщо foo var bar=baz || createBar(); //використовувати baz як значення для bar якщо //baz не хибно; інакше викликати createBar
Такий стиль елегантний і приємно лаконічний, але може викликати складнощі при читанні, особливо у початківців. Ви повинні розуміти, що означає такий запис у коді якщо зіткнетеся з нею, але можете утриматися від використання даного стилю спочатку і застосовувати традиційні вирази if та else для ясності.
Тернарний оператор
Часто необхідно встановити різне значення змінної на основі того, істинно чи хибно деяка умова. Звичайно, ви можете досягти цього з виразами if і else:
Увага! Невдале рішення
<code data-language="javascript">var propertyName; if (dim==='width') { propertyName='clientWidth'; }
else { propertyName='clientHeight'; }Однак тернарний оператор пропонує більш короткий спосіб встановити значення змінної відповідно до умови:
<code data-language="javascript">var propertyName=( dim==='width')? 'clientWidth' : 'clientHeight';
Вираз перед ? оцінюється на його істинність. Якщо воно є істинним, як значення змінної propertyName використовується перше значення (clientWidth); в іншому випадку застосовується друге значення (clientHeight).