JavaScript Для петли
Циклы могут выполнять блок кода несколько раз.
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 (statement 1; statement 2; statement 3) {
code block to be executed
}
Инструкция 1 выполняется (один раз) перед выполнением блока кода.
Инструкция 2 определяет условие для выполнения блока кода.
Инструкция 3 выполняется (каждый раз) после выполнения блока кода.
Пример
for (i = 0; i <5; i++) {
text += "The number is " + i + "<br>";
}
Из приведенного выше примера можно прочитать:
Инструкция 1 задает переменную перед началом цикла (var i = 0).
Инструкция 2 определяет условие для выполнения цикла (я должен быть меньше 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, необходимо предоставить разрыв внутри цикла. В противном случае цикл никогда не завершится. Это будет крах вашего браузера. Читайте о перерывах в более поздней главе этого учебника.
Заявление 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:"John", lname:"Doe", age:25};
var text = "";
var x;
for (x in person) {
text += person[x];
}
Цикл while
Цикл while и цикл do/while будут описаны в следующей главе.