for
===

Введение
--------

Оператор **for** создаёт цикл, состоящий из трех необязательных выражений, заключенных в круглые скобки и разделенных точкой с запятой, за которыми следует инструкция (часто блок инструкций), которая должна выполняться в цикле.

Интерактивный пример
--------------------

Синтаксис
---------


```js
for ([инициализация]; [условие]; [финальное выражение])
  [инструкция]
```


* `инициализация` Необязательный
    + : Выражение (включая выражения присваивания) или объявление переменной, вычисляемое один раз перед началом цикла. Обычно используется для инициализации переменной счетчика. Это выражение может опционально объявлять новые переменные с ключевыми словами `var` или `let`. Переменные, объявленные с помощью `var`, не являются локальными для цикла, т.е. они находятся в той же области видимости, что и цикл `for`. Переменные, объявленные с помощью `let`, являются локальными для оператора и не доступны за пределами цикла.Результат выполнения этого выражения отбрасывается.
* `условие` Необязательный
    + : Выражение, которое будет выполнятся перед каждой итерацией цикла. Если выражение оценивается как true, инструкция выполняется. Если выражение оценивается как false, выполнение выходит из цикла и переходит к первой инструкции после конструкции `for`.Условие не является обязательным. Если его нет, условие всегда всегда оценивается как `true`.
* `финальное выражение` Необязательный
    + : Выражение, выполняющееся в конце итерации цикла. Происходит до следующего выполнения условия. Обычно используется для обновления или увеличения переменной счётчика.
* инструкция
    + : Инструкция, которая выполняется, когда условие цикла истинно. Чтоб выполнить множество инструкций в цикле, используйте блок инструкций (en-US) (`{ ... }`) для группировки этих инструкций. Чтобы не выполнять никакой инструкции в цикле, используйте пустую инструкцию (`;`).
Примеры
-------

### Использование `for`

Следующий цикл `for` начинается объявлением переменной `i` и задания ей значения `0`. Затем проверяет, что `i` меньше девяти, выполняет инструкцию внутри блока инструкций и инкрементирует (Инкремент (en-US)) `i` на каждой итерации.


```js
for (let i = 0; i < 9; i++) {
  console.log(i);
  // ещё какие-то инструкции
}
```

### Синтаксис блока инициализации

В блоке инициализации возможно как объявления переменных, так и более сложные выражения. Однако выражения не могут использовать оператор `in` без скобок, потому что это конфликтует с циклом `for...in`.


```js
for (let i = "start" in window ? window.start : 0; i < 9; i++) {
  console.log(i);
}
// SyntaxError: 'for-in' loop variable declaration may not have an initializer.
```



```js
// Все выражение инициализации переменной взято в скобки
for (let i = ("start" in window) ? window.start : 0; i < 9; i++) {
  console.log(i);
}

// Выражение `in` взято в скобки
for (let i = ("start" in window) ? window.start : 0; i < 9; i++) {
  console.log(i);
}
```

### Необязательные выражения в `for`

Все 3 выражения в цикле `for` не обязательны.

Например, в блоке инициализации не требуется определять переменные:


```js
let i = 0;
for (; i < 9; i++) {
  console.log(i);
  // ещё выражения
}
```


Как и блок инициализации, блок условия не обязателен. Если пропустите это выражение, вы должны быть уверены, что прервёте цикл где-то в теле, а не создадите бесконечный цикл.


```js
for (let i = 0; ; i++) {
  console.log(i);
  if (i > 3) break;
  // тут какой-то код
}
```


Вы можете пропустить все 3 блока. Снова убедитесь, что используете `break`, чтоб закончить цикл, а также изменить счётчик, так что условие для break было истинно в нужный момент.


```js
let i = 0;

for (;;) {
  if (i > 3) break;
  console.log(i);
  i++;
}
```

### Использование `for` без блока инструкций

Следующий цикл `for` вычисляет смещение позиции узла в секции `[финальное выражение]`, и, следовательно, не требует использования инструкции или `блока инструкций` (en-US) внутри цикла, вместо этого используется точка с запятой (пустая инструкция).


```js
function showOffsetPos(id) {
  let left = 0,
    top = 0;

  for (
    let itNode = document.getElementById(id); // инициализация
    itNode; // условие
    left += itNode.offsetLeft,
      top += itNode.offsetTop,
      itNode = itNode.offsetParent // финальное выражение
  ); // точка с запятой (пустая инструкция)

  console.log(
    `Смещение позиции элемента "${id}":
слева: ${left}px;
сверху: ${top}px;`,
  );
}

showOffsetPos("content");

// Выводит:
// Смещение позиции элемента "content":
// слева: 0px;
// сверху: 153px;"
```


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

Спецификации
------------

| Specification |
| --- |
| ECMAScript Language Specification # sec-for-statement |

Совместимость с браузерами
--------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Смотрите также
--------------

* пустая инструкция
* `break`
* `continue`
* `empty`
* `while`
* `do...while`
* `for...in`
* `for...of`