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
|
---
title: for
slug: Web/JavaScript/Reference/Statements/for
translation_of: Web/JavaScript/Reference/Statements/for
---
<div>
<div>{{jsSidebar("Statements")}}</div>
</div>
<h2 id="Summary" name="Summary">Введение</h2>
<p>Выражение<strong> for</strong> создаёт цикл, состоящий из 3 необязательных выражений в круглых скобках, разделённых точками с запятой.</p>
<h2 id="Syntax" name="Syntax">Синтаксис</h2>
<pre class="syntaxbox">for ([<em>инициализация</em>]; [<em>условие</em>]; [<em>финальное выражение</em>])<em>выражение</em>
</pre>
<dl>
<dt><font face="Consolas, Liberation Mono, Courier, monospace">инициализация</font></dt>
<dd>Выражение (в том числе выражения присвоения) или определение переменных. Обычно используется, чтобы инициализировать счётчик. Это выражение может опционально объявлять новые переменные с помощью ключевого слова <code>var</code>. Эти переменные видимы не только в цикле, т.е. в той же области области видимости, что и цикл <code>for</code>. Результат этого выражения отбрасывается.</dd>
<dt><font face="Consolas, Liberation Mono, Courier, monospace">условие</font></dt>
<dd>Выражение, выполняющееся на каждой итерации цикла. Если выражение истинно, цикл выполняется. Условие не является обязательным. Если его нет, условие всегда считается истиной. Если выражение ложно, выполнение переходит к первому выражению, следующему за <code>for.</code></dd>
<dt><font face="Consolas, Liberation Mono, Courier, monospace">финальное выражение</font></dt>
<dd>Выражение, выполняющееся в конце итерации цикла. Происходит до следующего выполнения условия. Обычно используется для обновления или увеличения переменной счётчика.</dd>
<dt><font face="Consolas, Liberation Mono, Courier, monospace">выражение</font></dt>
<dd>Выражение, которое выполняется, когда условие цикла истинно. Чтоб выполнить множество выражений в цикле, используйте <a href="/ru/docs/JavaScript/Reference/Statements/block" title="JavaScript/Reference/Statements/block">блок</a> (<code>{ ... }</code>) для группировки этих выражений. Чтобы не выполнять никакого выражения в цикле, используйте <a href="/ru/docs/Web/JavaScript/Reference/Statements/Empty">пустое выражение</a> (<code>;</code>).</dd>
</dl>
<h2 id="Examples" name="Examples">Примеры</h2>
<h3 id="Example.3A_Using_for" name="Example.3A_Using_for">Использование <code>for</code></h3>
<p>Следующий цикл <code>for</code> начинается объявлением переменной <code>i </code>и задания ей значения <code>0</code>. Затем проверяет, что <code>i</code> меньше девяти, выполняет выражения внутри цикла и увеличивает <code>i</code> на 1 каждый раз.</p>
<pre class="brush: js">for (var i = 0; i < 9; i++) {
console.log(i);
// ещё какие-то выражения
}
</pre>
<h3 id="Необязательные_выражения_в_for">Необязательные выражения в <code>for</code></h3>
<p>Все 3 выражения в цикле <code>for</code> не обязательны.</p>
<p>Например, в блоке инициализации не требуется определять переменные:</p>
<pre class="brush: js">var i = 0;
for (; i < 9; i++) {
console.log(i);
// ещё выражения
}
</pre>
<p>Как и блок инициализации, блок условия не обязателен. Если пропустите это выражение, вы должны быть уверены, что прервёте цикл где-то в теле, а не создадите бесконечный цикл.</p>
<pre class="brush: js">for (var i = 0;; i++) {
console.log(i);
if (i > 3) break;
// тут какой-то код
}</pre>
<p>Вы можете пропустить все 3 блока. Снова убедитесь, что используете <code><a href="/ru/docs/Web/JavaScript/Reference/Statements/break">break</a></code>, чтоб закончить цикл, а также изменить счётчик, так что условие для break было истинно в нужный момент.</p>
<pre class="brush: js">var i = 0;
for (;;) {
if (i > 3) break;
console.log(i);
i++;
}
</pre>
<h3 id="Example.3A_Using_for_without_the_statement_section" name="Example.3A_Using_for_without_the_statement_section">Использование <code>for</code> без блока выражений</h3>
<p>Следующий цикл <code>for</code> вычисляет смещение позиции узла в секции <em>[финальное выражение]</em>, и, следовательно, не требует использования выражения внутри цикла или <code><a href="/ru/docs/JavaScript/Reference/Statements/block" title="JavaScript/Reference/Statements/block">блока</a></code>, <a href="/ru/docs/Web/JavaScript/Reference/Statements/Empty">пустое выражение</a> используется вместо этого.</p>
<pre class="brush: js">function showOffsetPos (sId) {
var nLeft = 0, nTop = 0;
for (var oItNode = document.getElementById(sId); // инициализация
oItNode; // условие
nLeft += oItNode.offsetLeft, nTop += oItNode.offsetTop, oItNode = oItNode.offsetParent) // финальное выражение
/* пустое выражение */ ;
console.log("Смещение позиции элемента \"" + sId + "\":\n left: " + nLeft + "px;\n top: " + nTop + "px;");
}
// Пример вызова:
showOffsetPos("content");
// Выводит:
// "Смещение позиции элемента "content":
// left: 0px;
// top: 153px;"</pre>
<div class="note"><strong>Замечание:</strong> В этом случае, когда вы не используете условие внутри цикла, <strong>точка с запятой ставится сразу после выражения цикла.</strong></div>
<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('ES6', '#sec-for-statement', 'for statement')}}</td>
<td>{{Spec2('ES6')}}</td>
<td> </td>
</tr>
<tr>
<td>{{SpecName('ES5.1', '#sec-12.6.3', 'for statement')}}</td>
<td>{{Spec2('ES5.1')}}</td>
<td> </td>
</tr>
<tr>
<td>{{SpecName('ES3', '#sec-12.6.3', 'for statement')}}</td>
<td>{{Spec2('ES3')}}</td>
<td> </td>
</tr>
<tr>
<td>{{SpecName('ES1', '#sec-12.6.2', 'for statement')}}</td>
<td>{{Spec2('ES1')}}</td>
<td>Изначальное определение</td>
</tr>
</tbody>
</table>
<h2 id="Поддержка_в_браузерах">Поддержка в браузерах</h2>
<p>{{Compat}}</p>
<h2 id="See_also" name="See_also">Также можете просмотреть</h2>
<ul>
<li>{{jsxref("Statements/break", "break")}}</li>
<li>{{jsxref("Statements/continue", "continue")}}</li>
<li>{{jsxref("Statements/empty", "empty")}}</li>
<li>{{jsxref("Statements/while", "while")}}</li>
<li><a href="/en-US/docs/Web/JavaScript/Reference/Statements/do...while"><code>do...while</code></a></li>
<li><a href="/en-US/docs/Web/JavaScript/Reference/Statements/for...in"><code>for...in</code></a></li>
<li><code><a href="/en-US/docs/Web/JavaScript/Reference/Statements/for...of"><code>for...of</code></a></code></li>
</ul>
|