logo_s

САМОУЧКА

Сайт для тех, кто хочет научиться

 

 

 

 

 

 

Главная

О Нас

Публикации

Связь

 

 

 

 

 

 

 

Наши публикации

 

HTML для новичков

 

XHTML

 

CSS для новичков

 

CSS 3

 

JavaScript

 


< Предыдущая  Следующая >

Циклы представляют собой блоки команд, которые могут повторно выполняться.

Циклы JavaScript

Цикл - это блок команд, который может повторно выполняться пока определенное условие не будет выполнено.

В JavaScript поддерживает следующие виды циклов:

  • for
  • while
  • do..while

Цикл For

Цикл for исполняет блок команд пока заданное условие является истинным.

Синтаксис:

for (блок определения;условие;блок изменения) {
//Блок команд, который будет повторно выполняться пока условие истинно
}

Когда цикл for начинает исполнение происходит следующее:

  1. Выполняются выражения заданные в блоке определения (в данном блоке определяются служебные переменные цикла такие как счетчик цикла);
  2. Производится оценка условия и если оно истинно (равно true) выполнение переходит к шагу 3. Если условие ложно (равно false) цикл завершается;
  3. Выполняется блок команд;
  4. Выполняются выражения заданные в блоке изменения (в данном блоке над счетчиком цикла производятся какие-либо изменения) и выполнение переходит к шагу 2.

Пример

for (i=1;i<=30;i++) {
document.write (i+'<br />');
}

Цикл While

Цикл while выполняет блок кода, пока заданное условие истинно.

Цикл while выполняет действия аналогичные циклу for и отличается от него только синтаксисом.

Синтаксис:

while (условие) {
//Блок команд, который будет повторно выполняться если условие истинно
}

Перепишем код из предыдущего примера под цикл while:

Пример

var i=1;
while (i<=30) {
document.write (i+'<br />');
i++;
}

Цикл do..while

Цикл do..while часто называют циклом с постусловием, потому что в отличие от предыдущих циклов он вначале исполняет блок команд и только потом проверяет заданное условие.

Если условие истинно блок команд выполняется еще раз, если условие ложно цикл завершает исполнение.

Синтаксис:

do {
//Блок команд, который будет выполнен больше одного раза если условие истинно
}
while (условие);

В примере ниже цикл do..while исполнит блок кода несмотря на то, что условие ложно изначально.

Пример

var i=20;
do {
document.write('Если Вы видите этот текст код в цикле был исполнен.');
}
while (i<=3);

Команда break

С помощью команды break Вы можете досрочно "обрывать" выполнение цикла.

Пример

//Задаем цикл, который должен выводить значения от 1 до 20
for (i=1;i<=20;i++) {
document.write(i + '<br />');
//Прервем выполнения цикла после того, как он досчитает до 5
if (i==5) {
break;
}
}

Команда continue

Команда continue обрывает текущую итерацию выполнения цикла и переходит к следующей.

Пример

//Задаем цикл который должен выводить значения от 1 до 15
for (i=1;i<=15;i++) {
//Пропустим 3, 10 и 13 круг выполнения цикла
if (i==3) {
continue;
}
else if (i==10) {
continue;
}
else if (i==13) {
continue;
}
document.write(i+'<br />');
}

Цикл for..in

Цикл for..in используется для перебора массивов или объектов.

В ходе выполнения цикла переменная будет поочередно принимать значения всех элементов массива или всех свойств объекта.

Синтаксис:

for (переменная in объект_или_массив) {
//Код, который будет выполнен для каждого элемента массива или свойства объекта
}

переменная данной переменной будет поочередно присвоено каждое свойство "перебираемого" объекта или каждый номер элемента массива.

Пример

//Зададим переменную, которой поочередно будут присваиваться все элементы массива
var y;
//Создадим массив с произвольными элементами
var favcity = new Array();
favcity[1]='Москва';
favcity[2]='Нью-Йорк';
favcity[3]='Лондон';
favcity[4]='Берлин';
//Выведем все элементы массива с помощью for..in
for (y in favcity) {
document.write('Мой любимый город № '+y+' '+favcity[y]+'.<br />');
}

Сделайте сами

Задание 1. Сократите код используя циклы:

Задание 1

<script type='text/javascript'>
document.write('Число: <b>100</b>');
document.write('<br />');
document.write('Число: <b>80</b>');
document.write('<br />');
document.write('Число: <b>60</b>');
document.write('<br />');
document.write('Число: <b>50</b>');
document.write('<br />');
document.write('Число: <b>40</b>');
document.write('<br />');
document.write('Число: <b>20</b>');
document.write('<br />');
document.write('Число: <b>10</b>');
document.write('<br />');
document.write('Число: <b>0</b>');
</script>

Задание 2. Исправьте ошибки в коде ниже:

Задание 2

function fun1() {
for (i=1,i<=10,i++); {
document.write(i + '<br />');
}
}
function fun2() {
for (i=100;i=>0;i-=10); {
document.write(i + '<br />');
}
}
function fun3() {
i=40;
while (i>=0)
if (i==25)
Cantinue;
document.write(i + '<br />');
i-=5;
}


< Предыдущая  Следующая >

 

 

 

 

 

Последние добавления

 

HotLog