Ветвления

1. Операторы ветвеления

Логические операторы не могут самостоятельно управлять потоком выполнения программы, для этого используются ветвления. Все они устроены по одному принципу - входные данные приводятся к булю (true или false) и, в зависимости от результата этого значения, поток программы направляется в ту или иную ветку.

2. Инструкция if

Входные данные, которые приводятся к булевому типу называются условием. Условие помещают за оператором if в круглых скобках. Если условие приводится к true, то выполняется код в фигурных скобках (ветка).

let cost = 0;
const subscription = 'pro';

if (subscription === 'pro') {
  cost = 100;
}

console.log(cost); // 100
Copy

Если условие приводится к false, код в фигурных скобках будет пропущен.

let cost = 0;
const subscription = 'free';

if (subscription === 'pro') {
  cost = 100;
}

console.log(cost); // 0
Copy

2.1. Инструкция if...else

Расширяет синтаксис оператора if тем, что в случае если условие приводится к false, выполнится код в фигурных скобках после оператора else.

let cost;
const subscription = 'free';

if (subscription === 'pro') {
  cost = 100;
} else {
  cost = 0;
}

console.log(cost); // 0
Copy

При true, оператор else и связанный с ним программный блок, игнорируются.

let cost;
const subscription = 'pro';

if (subscription === 'pro') {
  cost = 100;
} else {
  cost = 0;
}

console.log(cost); // 100
Copy

2.2. Инструкция else...if

Расширяет синтаксис оператора if...else тем, что после else снова добавляется оператор if. На первый взгляд код из множества подобных вложений кажется сложным. На самом деле, все ответвления - это результат false на все предыдущие вопросы.

При первом же true проверки прекратятся и выполнится только один сценарий, соответствующий этому true. Поэтому подобную запись следует читать как: ищу первое совпадение условия, игнорирую все остальное.

let cost;
const subscription = 'premium';

if (subscription === 'free') {
  cost = 0;
} else if (subscription === 'pro') {
  cost = 100;
} else if (subscription === 'premium') {
  cost = 500;
} else {
  console.log('Invalid subscription type');
}

console.log(cost); // 500
Copy

3. Тернарный оператор

Есть конструкция, похожая на if...else, с упрощенным синтаксисом, называемая тернарный оператор (ternary - тройной).

{условие} ? {выражение если условие правдиво} : {выражение если условие не правдиво}
Copy

Такая конструкция работает следующим образом:

• Вычисляется условие

• Если условие истинно (true), вычисляется выражение после ?, в противном случае значение после :

• Результат вычисленного выражения возвращается

let type;
const age = 20;

if (age >= 18) {
  type = 'adult';
} else {
  type = 'child';
}
Copy

Перепишем пример используя тернарный оператор.

const age = 20;
const type = age >= 18 ? 'adult' : 'child';
Copy

Запишем операцию поиска большего числа.

const num1 = 5;
const num2 = 10;
let biggerNumber;

if (num1 > num2) {
  biggerNumber = num1;
} else {
  biggerNumber = num2;
}

console.log(biggerNumber); // 10
Copy

Код работает верно, получаем большее число из двух, но это решение кажется слишком громоздким, учитывая, насколько проста проблема. Что делать? Используем тернарный оператор.

const num1 = 5;
const num2 = 10;
const biggerNumber = num1 > num2 ? num1 : num2;

console.log(biggerNumber); // 10
Copy

Тернарный оператор должен использоваться в простых операциях присваивания или возврата. Его использование для описания сложных ветвлений — плохая практика (антипаттерн).

4. Инструкция switch

В некоторых случаях сложности чтения логических конструкций можно избежать, используя оператор ветвления switch. Синтаксис этого оператора разбивает условие на общую часть switch и множество отдельных случаев case. Т.е. применимость этого оператора ограничена только задачами с одним общим вопросом и множеством вариантов ответов.

Значение выражения - строка или число, которое сравнивается со всеми значениями case. Если совпадения не произошло, управление передается default. Оператор break в завершении каждого блока case ставят чтобы прервать дальнейшие проверки и сразу перейти к коду за инструкцией switch.

let cost;
const subscription = 'premium';

switch (subscription) {
  case 'free':
    cost = 0;
    break;

  case 'pro':
    cost = 100;
    break;

  case 'premium':
    cost = 500;
    break;

  default:
    console.log('Invalid subscription type');
}

console.log(cost); // 500
Copy

Если оператор break будет отсутствовать, то после того как выполнится какое-то условие case, все последующие за ним блоки кода будут выполняться один за другим, что может привести к нежелательным последствиям при неверном применении.