# if/else розгалуження

## if...else

Ми вміємо виводити на екран (console.log), отримувати інформацію від людини (prompt) і зберігати дані в змінних. Ми ще не вміємо вчити комп'ютер самостійно вирішувати що йому робити, спираючись на наявні дані.

Загалом, іноді, в залежності від умови, потрібно виконати різні дії. Наприклад: **якщо** на вулиці холодно, **то** тепліше одягнутися, **інакше** піти гуляти як є.

Для цього є оператор `if`, наприклад:

```javascript
let temp = prompt("Яка на вулиці температура?");
if (temp < 5) {
    console.log("Одягни :) шапку!");
}
```

### Оператор if

Оператор if («якщо») отримує умову, в прикладі вище це `temp <5` Комп'ютер обчислює умову, і якщо результат - **так** (правда, `true`), то виконує команду, а якщо результат - ні (неправда, `false`), то просто пропускає команду.

Якщо за істинної умови потрібно виконати більше однієї команди - вони оформлюються блоком коду в фігурних дужках:

```javascript
if (temp < 5) {
    console.log("Будь ласка..");
    console.log("..одягни шапку!");
}
```

Зараз спробуйте навчити програму писати текст "оооо тепло", якщо температура більше 4х градусів. Для цього використовуйте оператор `>` (означає як `більше`)

Вийшло? Йдемо далі.

### Невірна умова, else

Цей блок потрібно писати, якщо є необхідність. Блок else («інакше») виконується, якщо умова невірна:

```javascript
let temp = prompt("Яка температура на вулиці?");

if (temp < 5) {
    console.log("Шапка!");
} else {
    console.log("Норм)"); // будь-яке значення, яке не менше 5
}
```

### Що можна розміщувати всередині блоків { } ?

Все що завгодно! Включаючи інші умови!

```
якщо (я хочу їсти) то {
    якщо (у мене багато коштів) то {
        зайти в ресторан
        замовити їжі
    }
    інакше {
        сходити в магазин
        приготувати собі їжі
    }
    // на цьому етапі роботи програми їжа точно поруч з вами
    поїсти
}
інакше {
    якщо (я давно не їв) {
        покачати прес
        повіджиматися
    }
}
```

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

```javascript
 == - дорівнює (так, саме два значка, НЕ ОДИН)
 != - не дорівнює
 >  - більше
 <  - менше
 >= - більше або дорівнює
 <= - менше або дорівнює
```

У програмуванні ми завжди щось з чимось порівнюємо.

Людською мовою:

```javascript
спочатку запитай скільки у людини грошей
потім, якщо більше 10, то сказати "круто!"
```

Комп'ютерною мовою `більше 10` - це дещо дивна нелогічна умова. Треба **щось** порівняти з **чимось**.&#x20;

Ось як для комп'ютера **правильно**:

```javascript
if (d > 10) ...
```

Ось як для комп'ютера **неправильно**:

```javascript
if (10) ...

// або

if (> 10) ...
```

## Питання

Що буде, якщо переплутати команди місцями?

```javascript
let a
if (a == 10) {
   console.log("А дорівнює 10");
}
a = prompt("введи число");
```

Що буде, якщо замість `==` писати `=`? наприклад ось:

```javascript
let a = 0;
if (a = 10) { // написали = 10 , а не == 10
    console.log("wow");
}
```

і ще таке спробуйте відразу:

```javascript
let a = 10;
if (a = 0) {
    console.log("wow!!!");
}
```

Чому так виходить? Якщо не знаєте відповіді - **не страшно, але просто не використовуйте `присвоїти` всередині умов**. Під кінець курсу можете запитати у волонтерів, чому це відбувається.

Тепер ви розумієте: є `дорівнює` (`==`), а є `присвоїти` (`=`) Не використовуйте присвоєння всередині умов.

А що буде тут?

```javascript
let a = prompt("введи число");
if (a == 10);
   console.log("А дорівнює ...");
   console.log("... десять!");
```

Щоб такого лиха не виникало, візьміть за правило: завжди використовувати фігурні дужки: `if (...) { ... }` (щоб явно виділити блок коду, який виконується за умовою)

Ще, вгадайте, що буде:

```javascript
if (3 < 2 < 4) {
    console.log("da");
}
```

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

### Порівняння рядків

До речі! Рядки теж можна порівнювати

```javascript
let a = prompt("Введи своє ім'я");
let b = prompt("Введи ім'я свого товариша");
if (a == b) {
    console.log("ВАУ");
}
```

### Логічні оператори

Про логічні оператори - і, або, не (`&&`, `||`, `!`) - читайте в матеріалах. Обов'язково.

### Оператори == і ===

Про різницю між ними ви можете прочитати в інтернеті

## Додаткові матеріали

[Умовне розгалуження (тернарний оператор)](https://uk.javascript.info/ifelse) *(uk.javascript.info)*

[Ще про тернарний оператор](https://shpp.gitbook.io/zero/nagadaiki-poyasnyaiki#ternarnii-operator) *(Ш++)*

[Оператори порівняння](https://uk.javascript.info/comparison) *(uk.javascript.info)*

[Логічні оператори](https://uk.javascript.info/logical-operators) *(uk.javascript.info)*

[Про скорочення перевірок змінних boolean](https://shpp.gitbook.io/zero/nagadaiki-poyasnyaiki#boolean) *(Ш++)*

{% embed url="<https://www.youtube.com/watch?v=tFyRhDZgHaU>" %}

{% embed url="<https://youtu.be/oSO_StIWaXM>" %}

## Обов'язкові задачі

{% content-ref url="if-else/km-day-1" %}
[km-day-1](https://shpp.gitbook.io/zero/tutorials/if-else/km-day-1)
{% endcontent-ref %}

{% content-ref url="if-else/km-day-2" %}
[km-day-2](https://shpp.gitbook.io/zero/tutorials/if-else/km-day-2)
{% endcontent-ref %}

{% content-ref url="if-else/empire-state-building-lift" %}
[empire-state-building-lift](https://shpp.gitbook.io/zero/tutorials/if-else/empire-state-building-lift)
{% endcontent-ref %}

*Виникли питання або труднощі?* [*Зверніться за допомогою до Ш++.*](https://shpp.gitbook.io/zero/arrangements/support)