aboutsummaryrefslogtreecommitdiff
path: root/files/uk/web/javascript/reference/statements/if...else/index.html
blob: bee07d07bf97ff2ce8c375a1c6022ded8fd6a93f (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
---
title: if...else
slug: Web/JavaScript/Reference/Statements/if...else
tags:
  - JavaScript
  - else
  - if
  - Оператор
translation_of: Web/JavaScript/Reference/Statements/if...else
---
<div>{{jsSidebar("Statements")}}</div>

<p><span class="seoSummary">Умовний оператор <strong><code>if</code></strong> виконує команду, якщо вказана умова є {{Glossary("truthy", "правдивою")}}. Якщо умова є {{Glossary("falsy", "хибною")}}, може бути виконана інша команда.</span></p>

<div>{{EmbedInteractiveExample("pages/js/statement-ifelse.html")}}</div>

<div class="hidden">The source for this interactive example is stored in a GitHub repository. If you'd like to contribute to the interactive examples project, please clone <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> and send us a pull request.</div>

<h2 id="Синтаксис">Синтаксис</h2>

<pre class="syntaxbox">if (<var>condition</var>)
   <var>statement1</var>
[else
   <var>statement2</var>]
</pre>

<dl>
 <dt><code>condition</code></dt>
 <dd><a href="/uk/docs/Web/JavaScript/Guide/Expressions_and_Operators#Expressions">Вираз</a>, який вважається або {{Glossary("truthy", "правдивим")}}, або {{Glossary("falsy", "хибним")}}.</dd>
</dl>

<dl>
 <dt><code>statement1</code></dt>
 <dd>Команда, що виконується, якщо <var>умова</var> є {{Glossary("truthy", "правдивою")}}. Може бути будь-яка команда, в тому числі вкладені оператори <code>if</code>. Для виконання кількох команд використовуйте <a href="/uk/docs/Web/JavaScript/Reference/Statements/block" title="en/JavaScript/Reference/Statements/block">блок</a> ({ ... }), щоб згрупувати ці команди. Щоб не виконувати жодних команд, використайте <a href="/uk/docs/Web/JavaScript/Reference/Statements/Empty">порожній</a> оператор.</dd>
</dl>

<dl>
 <dt><code>statement2</code></dt>
 <dd>Команда, що виконується, якщо <var>умова</var> є {{Glossary("falsy", "хибною")}} та присутній блок <code>else</code>. Може бути будь-яка команда, в тому числі блок команд та вкладені оператори <code>if</code>.</dd>
</dl>

<h2 id="Опис">Опис</h2>

<p>Можна додавати вкладені вирази <code>if...else</code> для створення конструкції <code>else if</code>. Зауважте, що у JavaScript не існує ключового слова <code>elseif</code> (одним словом).</p>

<pre class="brush: js">if (<var>condition1</var>)
  <var>statement1</var>
else if (<var>condition2</var>)
  <var>statement2</var>
else if (<var>condition3</var>)
  <var>statement3</var>
...
else
  <var>statementN</var>
</pre>

<p>Щоб побачити, як це працює, ось так це виглядає з правильно оформленими відступами:</p>

<pre class="brush: js">if (<var>condition1</var>)
  <var>statement1</var>
else
  if (<var>condition2</var>)
    <var>statement2</var>
  else
    if (<var>condition3</var>)
...
</pre>

<p>Щоб виконати декілька команд, використовуйте позначення блоку (<code>{ ... }</code>), щоб згрупувати ці команди. Взагалі, гарною практикою вважається завжди використовувати блочні вирази, особливо у коді, який містить вкладені оператори <code>if</code>:</p>

<pre class="brush: js">if (<var>condition</var>) {
  <var>statements1</var>
} else {
  <var>statements2</var>
}
</pre>

<p>Не плутайте примітивні булеві значення <code>true</code> та <code>false</code> з правдивістю та хибністю об'єкта {{jsxref("Global_Objects/Boolean", "Boolean")}}. Будь-яке значення, яке не є <code>false</code>, <code>undefined</code>, <code>null</code>, <code>0</code>, <code>-0</code>, <code>NaN</code>, або порожнім текстовим рядком (<code>""</code>), і будь-який об'єкт, в тому числі об'єкт Boolean, чиє значення дорівнює false, вважається {{Glossary("truthy", "правдивим")}} при використанні у якості умови. Для прикладу:</p>

<pre class="brush: js">var b = new Boolean(false);
if (b) // ця умова є правдивою
</pre>

<h2 id="Приклади">Приклади</h2>

<h3 id="Використання_if...else">Використання <code>if...else</code></h3>

<pre class="brush: js">if (cipher_char === from_char) {
  result = result + to_char;
  x++;
} else {
  result = result + clear_char;
}
</pre>

<h3 id="Використання_else_if">Використання <code>else if</code></h3>

<p>Зауважте, що у JavaScript немає оператора <code>elseif</code>. Однак, ви можете його записати з пробілом між <code>else</code> та <code>if</code>:</p>

<pre class="brush: js">if (x &gt; 50) {
  /* зробити що треба */
} else if (x &gt; 5) {
  /* зробити що треба */
} else {
  /* зробити що треба */
}</pre>

<h3 id="Присвоєння_всередині_умовного_виразу">Присвоєння всередині умовного виразу</h3>

<p>Не рекомендовано використовувати прості присвоєння в умовному виразі, тому що присвоєння можна переплутати з порівнянням при швидкому перегляді коду. Наприклад, не використовуйте наступний код:</p>

<pre class="brush: js example-bad">if (x = y) {
  /* зробити що треба */
}
</pre>

<p>Якщо вам потрібно використати присвоєння в умовному виразі, загальноприйнятим є використання додаткових дужок навколо присвоєння. Наприклад:</p>

<pre class="brush: js example-good">if ((x = y)) {
  /* зробити що треба */
}
</pre>

<h2 id="Специфікації">Специфікації</h2>

<table class="standard-table">
 <tbody>
  <tr>
   <th scope="col">Специфікація</th>
   <th scope="col">Статус</th>
   <th scope="col">Коментар</th>
  </tr>
  <tr>
   <td>{{SpecName('ESDraft', '#sec-if-statement', 'if statement')}}</td>
   <td>{{Spec2('ESDraft')}}</td>
   <td></td>
  </tr>
  <tr>
   <td>{{SpecName('ES6', '#sec-if-statement', 'if statement')}}</td>
   <td>{{Spec2('ES6')}}</td>
   <td></td>
  </tr>
  <tr>
   <td>{{SpecName('ES5.1', '#sec-12.5', 'if statement')}}</td>
   <td>{{Spec2('ES5.1')}}</td>
   <td></td>
  </tr>
  <tr>
   <td>{{SpecName('ES3', '#sec-12.5', 'if statement')}}</td>
   <td>{{Spec2('ES3')}}</td>
   <td></td>
  </tr>
  <tr>
   <td>{{SpecName('ES1', '#sec-12.5', 'if statement')}}</td>
   <td>{{Spec2('ES1')}}</td>
   <td>Початкове визначення</td>
  </tr>
 </tbody>
</table>

<h2 id="Сумісність_з_веб-переглядачами">Сумісність з веб-переглядачами</h2>



<p>{{Compat("javascript.statements.if_else")}}</p>

<h2 id="Див._також">Див. також</h2>

<ul>
 <li>{{jsxref("Statements/block", "block")}}</li>
 <li>{{jsxref("Statements/switch", "switch")}}</li>
 <li><a href="/uk/docs/JavaScript/Reference/Operators/Conditional_Operator">Умовний оператор</a></li>
</ul>