JavaScript: инструкция if else

В этой главе:

  • Составные инструкции

  • Инструкция if

  • Условный оператор

По умолчанию интерпретатор JavaScript выполняет инструкции одну за другой в порядке их следования в исходном коде. В тех случаях, когда выполнение или невыполнение некоторых инструкций должно зависеть от выполнения или невыполнения некоторого условия, используются условные (управляющие) конструкции.

Составные инструкции

Составная инструкция - это просто последовательность инструкций, заключённая в фигурные скобки. Таким образом, следующие строки кода рассматриваются как одна инструкция:

1
2
3
4
5
{
  x = 5;
  alert(x);
  a = (x + y) * 2;
}

Составную инструкцию обычно называют просто блоком кода или телом другой инструкции. Обратите внимание, что составная инструкция не завершается точкой с запятой. Отдельные инструкции внутри блока завершаются точками с запятой, однако сам блок нет.

Составные инструкции позволяют использовать множество инструкций там, где допускается использовать только одну инструкцию, например в качестве тела условной инструкции if.

Инструкция if

Инструкция if имеет две формы. Первая:

синтаксис инструкции if в JavaScript

Сначала вычисляется значение выражения. Полученное значение, если необходимо, неявно преобразуется к логическому типу. Само выражение называется условием выполнения инструкции if или просто условие. Если результатом вычисления выражения является истинное значение, то инструкция выполняется. Если выражение возвращает ложное значение, то инструкция не выполняется.

1
2
3
4
5
6
7
var num;
 
if (!num)     // Если переменная num имеет ложное значение
  num = 123;  // Присвоить ей значение 123
 
 
document.write("num: " + num);

Синтаксис JavaScript позволяет вставить только одну выполняемую инструкцию после инструкции if, однако если требуется выполнить более одной инструкции, её всегда можно заменить блоком инструкций:

синтаксис инструкции if с телом, состоящим из нескольких инструкций, в JavaScript

Обратите внимание, даже если используется всего одна инструкция, её можно заключить в фигурные скобки, но это не обязательно:

1
2
3
if (!num) {
  num = 123;
}

С инструкцией if может использоваться ключевое слово else, которое позволяет добавить инструкцию (или блок кода), выполняемую, если условие имеет ложное значение. Вторая форма инструкции if:

синтаксис инструкции if-else в JavaScript

В этой форме, если выражение возвращает истинное значение выполняется инструкция, расположенная в блоке if, если результатом вычисления является ложное значение, то выполняется инструкция расположенная в блоке else:

1
2
3
4
5
6
var num = 15;
 
if (num > 10)
  alert("число " + num + " больше 10");
else
  alert("число " + num + " меньше 10");

Инструкции if/else могут быть вложенными. Инструкция if является вложенной, если она находится внутри другого блока if или else. При использовании нескольких инструкций if, else всегда ассоциируется с ближайшим к нему if:

1
2
3
4
5
6
if(i) {
  if(a) инструкция1;
  if(b) инструкция2;
  else  инструкция3;  // else относится к if(b)
}
else инструкция4;     // else относится к if(i)

Часто на практике бывает необходимо проверить несколько вариантов условий. Для этого можно применить следующую конструкцию:

1
2
3
4
5
6
7
8
9
10
11
var num = 2;
 
if (num == 1) {
  alert("значение num: " + num);
} else if (num == 2) {
  alert("значение num: " + num);
} else if (num == 3) {
  alert("значение num: " + num);
} else {
  alert("Не знаю такого числа!");
}

В этом коде нет ничего особенного. Это просто последовательность инструкций, где каждая инструкция if является частью else предыдущей инструкции if/else. Для новичков такая форма записи на первый взгляд может показаться не совсем понятной, поэтому рассмотрим синтаксически эквивалентную форму, показывающую вложенность инструкций if:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
if (num == 1) {
  alert("значение num: " + num);
}
else {
  if (num == 2) {
   alert("значение num: " + num);
  }
  else {
    if (num == 3) {
      alert("значение num: " + num);
    }
    else {
      alert("Не знаю такого числа!");
    }
  }
}

Условный оператор

Оператор

Операция

A

N

Типы значений

?:

Выбор второго или третьего операнда

R

3

булево, любое, любое→любое

Условный оператор - это единственный тернарный оператор в JavaScript. Первый операнд предшествует символу ?, второй - между ? и :, третий - после :.

синтаксис тернарного оператора в JavaScript

Операнды условного оператора могут быть любого типа. Первый операнд вычисляется и преобразуется (если необходимо) в логическое значение. Он используется в качестве условия - как выражение в круглых скобках инструкции if. Скобки вокруг проверяемого условия не обязательны, но их довольно часто используют для того, чтобы упростить визуальное восприятие этого оператора. Если первый операнд возвращает истинное значение, то вычисляется и возвращается значение второго операнда. Если первый операнд имеет ложное значение, то вычисляется и возвращается значение третьего операнда. Обратите внимание, что вычисляется всегда только значение какого-то одного операнда - второго или третьего, оба никогда не вычисляются.

1
document.write(true ? 5 : 10);

Условный оператор имеет ассоциативность справа налево, поэтому следующие две инструкции эквивалентны:

1
2
q = a?b:c?d:e?f:g;
q = a?b:(c?d:(e?f:g));

Условный оператор часто используется как более краткий вариант инструкции if/else.

1
2
3
4
5
6
7
8
9
10
11
12
var a, b, num = 2;
 
if (num)
  a = 5;
else
  a = 10;
 
// тоже самое, только с условным оператором
var b = num ? 5 : 10;
 
document.write("a: " + a + "<br>");
document.write("b: " + b);

Вложенные инструкции if/else, так же можно заменить последовательностью из тернарных операторов:

1

2

3

4

5

6

7

8

var i = 5;
 
var x = (i == 3) ? 'значение1' :
(i == 5) ? 'значение2' :
(i > 6) ? 'значение3' :
'значение4';
 
document.write(x);