САЙТ ДЛЯ ВЕБ РАЗРАБОТЧИКОВ НА РУССКОМ ЯЗЫКЕ

JavaScript Цикл for



Цикл, может выполнить блок кода несколько раз.


JavaScript циклы

Циклы удобны, если вы хотите запускать один и тот же код снова и снова, каждый раз с другим значением.

Часто это происходит при работе с массивами:

Вместо этого кода:

text += cars[0] + "<br>";
text += cars[1] + "<br>";
text += cars[2] + "<br>";
text += cars[3] + "<br>";
text += cars[4] + "<br>";
text += cars[5] + "<br>";

Вы можете написать цикл:

var i;
for (i = 0; i < cars.length; i++) {
  text += cars[i] + "<br>";
}
Редактор кода »

Различные виды циклов

JavaScript поддерживает различные виды циклов:

  • for - цикл проходит через блок кода несколько раз
  • for/in - циклы проходят через свойства объекта
  • while - циклы проходят через блок кода, когда заданное условие истинно
  • do/while - также цикл проходит через блок кода, пока заданное условие истинно

Цикл for

Цикл for имеет следующий синтаксис:

for (заявление 1; заявление 2; заявление 3) {
  // блок кода для выполнения
}

Заявление 1 выполняется (один раз) перед выполнением блока кода.

Заявление 2 определяет условие выполнения блока кода.

Заявление 3 выполняется (каждый раз) после выполнения блока кода.

Пример

for (i = 0; i < 5; i++) {
  text += "Число" + i + "<br>";
}
Редактор кода »

Из приведенного выше примера, вы можете прочитать:

Заявление 1 задает переменную перед началом цикла var i = 0;.

Заявление 2 определяет условие для выполнения цикла i < 5; (я должен быть меньше 5).

Заявление 3 увеличивает значение при каждом выполнении блока кода в цикле i++ .


Заявление 1

Сначало вы будете использовать заявление 1 для инициализации переменной, используемой в цикле i = 0.

Это не всегда так, JavaScript не волнует. Заявление 1 является необязательным.

Вы можете инициировать много значений в заявление 1 (разделенных запятой):

Пример

for (i = 0, len = cars.length, text = ""; i < len; i++) {
  text += cars[i] + "<br>";
}
Редактор кода »

И вы можете опустить заявление 1 (например, когда ваши значения установлены до начала цикла):

Пример

var i = 2;
var len = cars.length;
var text = "";
for (; i < len; i++) {
  text += cars[i] + "<br>";
}
Редактор кода »

Заявление 2

Часто заявление 2 используется для оценки состояния исходной переменной.

Это не всегда так, JavaScript не волнует. Заявление 2 также является необязательным.

Если заявление 2 возвращает true, цикл начнется снова, если он возвращает false, цикл закончится.

Если вы опустите заявление 2, вы должны предоставить break внутри цикла. Иначе петля никогда не закончится. Это приведет к сбою Вашего браузера. Читайте о перерывах в следующей главе этого руководства.


Заявление 3

Часто заявление 3 увеличивает значение начальной переменной.

Это не всегда так, JavaScript не волнует, и заявление 3 является необязательным.

Заявление 3 может делать что угодно, например отрицательное приращение i--, положительное приращение i = i + 15 или что-либо еще.

Заявление 3 также может быть опущен (например, при увеличении значений внутри цикла):

Пример

var i = 0;
var len = cars.length;
for (; i < len; ) {
  text += cars[i] + "<br>";
 i++;
}
Редактор кода »

Цикл for/in

JavaScript заявление for/in перебирает свойства объекта:

Пример

var person = {fname:"Андрей", lname:"Щипунов", age:49};

var text = "";
var x;
for (x in person) {
  text += person[x];
}
Редактор кода »

Цикл while

Цикл while и do/while, цикл будет объяснен в следующей главе.


Проверьте себя с помощью упражнений!

Упражнение:

Создать цикл, который выполняется от 0 до 9.

var i;
 (
 = ;
 < ;
)
{
console.log(i);
}

Начните упражнения