Інструкція if...else (якщо... інакше) виконує інструкцію if, якщо задана умова є істинною. Якщо ця умова є хибною, то виконується інша інструкція, в положенні else.

Спробуйте його в дії

Синтаксис

if (condition)
  statement1

// З положенням else
if (condition)
  statement1
else
  statement2

condition

Вираз, котрий розглядатиметься на предмет істинності або хибності.

statement1

Інструкція, що виконується, якщо condition має істинне значення. Може бути будь-якою інструкцією, включно зі вкладеними інструкціями if. Аби виконати декілька інструкцій, слід використати інструкцію-блок ({ /* ... */ }) для їх групування. Аби не виконувати жодних інструкцій, слід використати порожню інструкцію.

statement2

Інструкція, що виконується, якщо condition має хибне значення і якщо положення else існує. Може бути будь-якою інструкцією, включно з інструкцією-блоком та вкладеними інструкціями if.

Опис

Декілька інструкцій if...else можуть бути вкладені одна в одну, аби утворити положення else if. Зверніть увагу, що в JavaScript немає ключового слова elseif (одним словом).

if (condition1)
  statement1
else if (condition2)
  statement2
else if (condition3)
  statement3
// …
else
  statementN

Аби побачити, як це працює, то ось, який вигляд це б мало, якби вкладення мали коректні відступи:

if (condition1)
  statement1
else
  if (condition2)
    statement2
  else
    if (condition3)
      statement3
// …

Аби виконати декілька інструкцій в межах одного положення, слід використати інструкцію-блок ({ /* ... */ }) для їх групування.

if (condition) {
  statements1
} else {
  statements2
}

Невикористання блоків може призводити до неочевидної поведінки, особливо якщо код відформатований вручну. Наприклад:

function checkValue(a, b) {
  if (a === 1)
    if (b === 2)
      console.log("a – це 1, а b – це 2");
  else
    console.log("a – це не 1");
}

Цей код має безневинний вигляд, а проте виконання checkValue(1, 3) виведе "a – це не 1". Так відбувається через те, що при наявності обірваного else положення else приєднується до найближчого положення if. Таким чином, код вище, отримавши коректні відступи, матиме такий вигляд:

function checkValue(a, b) {
  if (a === 1)
    if (b === 2)
      console.log("a – це 1, а b – це 2");
    else
      console.log("a – це не 1");
}

Загалом, доброю практикою є завжди використовувати інструкції-блоки, особливо коли в коді є вкладені інструкції if.

function checkValue(a, b) {
  if (a === 1) {
    if (b === 2) {
      console.log("a – це 1, а b – це 2");
    }
  } else {
    console.log("a – це не 1");
  }
}

Не слід плутати примітивні значення Boolean true і false з істинністю або хибністю об'єкта Boolean. Усі значення, окрім false, undefined, null, 0, -0, NaN і порожнього рядка (""), в тому числі будь-які об'єкти, серед яких об'єкти Boolean зі значенням false, вважаються істинними, бувши використані як умова. Наприклад:

const b = new Boolean(false);
if (b) {
  console.log("b – істинне значення"); // "b – істинне значення"
}

Приклади

Вживання if...else

if (cipherChar === fromChar) {
  result += toChar;
  x++;
} else {
  result += clearChar;
}

Вживання else if

Зверніть увагу на те, що в JavaScript немає синтаксису elseif. Проте можна написати таке з пробілом між else та if:

if (x > 50) {
  /* якісь дії */
} else if (x > 5) {
  /* якісь дії */
} else {
  /* якісь дії */
}

Використання присвоєння як умови

Майже ніколи не повинно бути if...else з присвоєнням виду x = y як умовою:

if ((x = y)) {
  // …
}

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

x = y;
if (x) {
  // …
}

Що набагато ясніше. Проте на той рідкісний випадок, коли захочеться зробити щось подібне, документація while містить розділ Використання присвоєння як умови, який вміщає наші рекомендації.

Специфікації

Сумісність із браузерами

Дивіться також

• block
• switch
• Умовний (тернарний) оператор