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

Синтаксис

for ([initialization]; [condition]; [final-expression])
   statement
initialization
Вираз (в тому числі вирази присвоєння) або оголошення змінної, оцінюється один раз перед початком циклу. Зазвичай використовується для ініціалізації змінної лічильника. Цей вираз може також оголошувати нові змінні ключовими словами var або let. Змінні, оголошені через var не є локальними для циклу, тобто, вони знаходяться у тій же області видимості, що й сам цикл for. Змінні, оголошені через let, є локальними змінними циклу.
Результат цього виразу відкидається.
condition
Вираз, який оцінюється перед кожною ітерацією циклу. Якщо вираз оцінюється як true, то statement виконується. Ця перевірка є необов'язковою. Якщо вона пропущена, то умова завжди оцінюється як true. Якщо вираз оцінюється як false, виконання переходить до першого виразу, розташованого після конструкції for.
final-expression
Вираз, який оцінюється в кінці кожної ітерації циклу. Це відбувається до наступного оцінювання виразу condition. Зазвичай використовується, щоб оновити або збільшити значення змінної лічильника.
statement
Команда, яка виконується, поки умова оцінюється як true. Для виконання кількох команд, використовуйте блок ({ ... }), щоб згрупувати ці команди. Щоб не виконувати жодних команд, скористайтесь порожнім оператором (;).

Приклади

Використання циклу for

Наведений цикл for починається з оголошення змінної i та ініціалізації її значенням 0. Він перевіряє, що значення i менше дев'яти, виконує дві команди та збільшує i на 1 після кожного проходу через цикл.

for (let i = 0; i < 9; i++) {
   console.log(i);
   // ще команди
}

Необов'язкові вирази циклу for

Всі три вирази у шапці циклу for є необов'язковими.

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

var i = 0;
for (; i < 9; i++) {
    console.log(i);
    // ще команди
}

Як і блок initialization, блок умови condition також є необов'язковим. Якщо ви пропускаєте цей вираз, то маєте переконатись, що встановили переривання у тілі циклу, щоб не створити нескінченний цикл.

for (let i = 0;; i++) {
   console.log(i);
   if (i > 3) break;
   // ще команди
}

Ви також можете пропустити всі три блоки. Знову ж таки, переконайтеся, що ви встановили оператор break, щоб закінчити цикл, а також змінили (збільшили) змінну, щоб умова для переривання в якийсь момент набула значення true.

var i = 0;

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

Використання циклу for без команд

Наведений цикл for обчислює зміщення вузла у розділі final-expression, і тому не вимагає використання розділу statement, замість нього використовується крапка з комою.

function showOffsetPos(sId) {

  var nLeft = 0, nTop = 0;

  for (

    var oItNode = document.getElementById(sId); /* ініціалізація */

    oItNode; /* умова */

    nLeft += oItNode.offsetLeft, nTop += oItNode.offsetTop, oItNode = oItNode.offsetParent /* final-expression */

  ); /* крапка з комою */ 

  console.log('Зміщення елемента \'' + sId + '\':\n left: ' + nLeft + 'px;\n top: ' + nTop + 'px;');

}

/* Приклад виклику: */

showOffsetPos('content');

// Результат:
// "Зміщення елемента "content":
// left: 0px;
// top: 153px;"
Заувага: Це один з небагатьох випадків у JavaScript, коли крапка з комою є обов'язковою. Дійсно, без крапки з комою рядок, що записаний після циклу, вважатиметься командою циклу.

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

Специфікація Статус Коментар
ECMAScript 1st Edition (ECMA-262)
The definition of 'for statement' in that specification.
Standard Початкове визначення.
ECMAScript 3rd Edition (ECMA-262)
The definition of 'for statement' in that specification.
Standard
ECMAScript 5.1 (ECMA-262)
The definition of 'for statement' in that specification.
Standard
ECMAScript 2015 (6th Edition, ECMA-262)
The definition of 'for statement' in that specification.
Standard
ECMAScript Latest Draft (ECMA-262)
The definition of 'for statement' in that specification.
Draft

Сумісність з веб-переглядачами

Update compatibility data on GitHub
DesktopMobileServer
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome for AndroidFirefox for AndroidOpera for AndroidSafari on iOSSamsung InternetNode.js
forChrome Full support YesEdge Full support YesFirefox Full support 1IE Full support YesOpera Full support YesSafari Full support YesWebView Android Full support YesChrome Android Full support YesFirefox Android Full support 4Opera Android Full support YesSafari iOS Full support YesSamsung Internet Android Full support Yesnodejs Full support Yes

Legend

Full support  
Full support

Див. також

Мітки документа й учасники

Мітки: 
Зробили внесок у цю сторінку: DariaManko
Востаннє оновлена: DariaManko,