Учебник по программированию.

Аннотация

Содержание

Главная

Приобрести книгу в формате pdf

Контакты

Карта сайта

Предыдущий параграф

Назад в содержание

Следующий параграф

§04. Циклы.

Цикл – определённая последовательность действий, которая повторяется до тех пор, пока не будет выполнено какое-либо условие. Циклы имеют огромное значение в программировании. Если бы их не было, то программистам пришлось бы писать «тонны» кода, который бы с трудом помещался в памяти компьютера. Благодаря циклам, все повторяющиеся действия можно «зацикливать», и они повторяются нужное количество раз.

В JavaScript существует 4 вида циклов. На данном этапе мы рассмотрим первые 3.

Цикл счётчик.

С помощью цикла счётчика можно выполнить какое либо действие заранее запланированное количество раз. С помощью данного цикла удобно обрабатывать данные, в которых заранее известно количество элементов. Конструкция, которая организует цикл счётчик, выглядит следующим образом:

for (создание_переменной; её_проверка; её¬_увеличение) действие;

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

Примечание: в отличие от других языков, в JavaScript внутри цикла счётчика переменная счётчик может быть изменена. Тем не менее, делать это, на мой взгляд, бессмысленно, т.к. в таком случае лучше воспользоваться другим циклом.

Далее для примера выведем в окно браузера цифры от 0 до 9:

<script> for (var count = 0; count < 10; count = count + 1) document.write(count); </script>

Обратите внимание на то, что при создании переменной ей было сразу присвоено значение ноль. В JavaScript это допустимо и является обычной практикой в программировании. Присваивать значения переменным при их создании можно не только в данном цикле, но и в любом месте кода. Так же обратите внимание на то место кода, в котором происходит увеличение переменной. Переменная count находится как в правой части от знака равно, так и в левой. Это тоже обычная практика в программировании. Дело в том, что в начале вычисляется выражение, находящееся справа от знака равно, а только после этого результат этого вычисления присваивается переменной.

Примечание: в переводе с английского count обозначает счёт, счётчик. Именно поэтому для данной переменной подобрано такое имя.

Теперь для понимания того, как работает цикл счётчик, приведём блок-схему алгоритма работы предыдущей программы:

Так же, как и в случае с конструкцией if, если действие состоит из нескольких операций, то их необходимо заключить в фигурные скобки. Пример:

<script> for (var count = 0; count < 10; count = count + 1) { document.write('count = '); document.write(count); document.write('<br>'); } </script>

Примечание: в конструкции if и в конструкции for, если действие состоит из нескольких операций, то их необходимо заключить в фигурные скобки. Это же правило относится и ко всем последующим конструкциям, которые мы изучим. Поэтому к этому вопросу возвращаться больше не будем.

Цикл с предварительной проверкой условия.

Данный цикл повторяется до тех пор, пока условие остаётся верным. Причём это условие проверяется перед каждым новым проходом, в том числе и перед первым. Поэтому действие цикла может не выполниться ни разу. Переменная, находящаяся в условии, так же (не обязательно) может быть использована внутри цикла.

Конструкция, которая организует цикл с предварительной проверкой условия, выглядит следующим образом:

while (условие) действие;

Далее для примера перепишем программу вывода десяти цифр с помощью этого цикла:

<script> var count = 0; while (count < 10) { document.write('count = '); document.write(count); document.write('<br>'); count = count +1; } </script>

Как видите результат тот же самый. Здесь у вас может возникнуть естественный вопрос: зачем нужен цикл счётчик, если его можно организовать с помощью данного цикла? Ответ прост: он нужен для удобства и сокращения кода, потому что используется он достаточно часто.

Теперь блок-схема алгоритма работы программы:

Цикл с проверкой условия после прохода.

Данный цикл отличается от предыдущего тем, что проверка условия происходит не перед каждым проходом, а после. Поэтому он будет выполнен хотя бы один раз в любом случае. В этом и есть его назначение – в том что бы цикл повторился хотя бы один раз не зависимо от условия.

Конструкция, которая организует цикл с проверкой условия после каждого прохода, выглядит следующим образом:

do действие while (условие);

Теперь перепишем программу вывода цифр с помощью этого цикла:

<script> var count = 0; do { document.write('count = '); document.write(count); document.write('<br>'); count = count +1 } while (count < 10); </script>

Далее блок-схема алгоритма этой программы:

Примечание: обратите внимание на то каким образом оформлен код всех циклов. По правилам JavaScript возможно и другое оформление. Тем не менее, именно в таком виде код наиболее понятен. Так же обратите внимание на все точки с запятой, и фигурные скобки. На то, где и в каких местах они находятся. Будьте внимательны, потому что именно из-за их отсутствия программа может не работать.

Цикл внутри цикла.

Цикл можно поместить в любом месте кода, даже в нутрии другого цикла. Для примера выведем в окно браузера результаты умножения двух чисел от 1 до 3 с помощью двух циклов счётчиков:

<script> for (var i = 1; i<10; i = i+1) for (var j = 1; j<10; j = j+1) { document.write(i); document.write('*'); document.write(j); document.write('='); document.write(i*j); document.write('<br>'); } </script>

Задачи.

1. Составить блок схему алгоритма работы программы из предыдущего примера (цикл внутри цикла).

2. Вывести в окно браузера таблицу умножения. Составить блок схему алгоритма. Результат работы программы должен быть примерно таким:

3. Вывести в окно браузера матрицу 4х3 со случайными числами. Составить блок-схему алгоритма.

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

5. Вычислить с помощью цикла счётчика факториал числа 5. Промежуточные результаты выводить в окно браузера. Составить блок-схему алгоритма. Примечание: факториал числа 5 это 1*2*3*4*5.

Примеры решений.

2.

<script> //Создаём таблицу document.write('<table>'); //Создаём первую строку document.write('<tr>'); //Пустая первая ячейка document.write('<td>'); document.write('</td>'); //Вставляем цифры от 1 до 9 for (var i = 1; i<10; i = i+1) { document.write('<td>'); document.write('<b>'); document.write(i); document.write('</b>'); document.write('</td>'); } document.write('</tr>'); //Заполняем таблицу for (var i = 1; i<10; i = i+1) { document.write('<tr>'); //Формируем первый столбец document.write('<td>'); document.write('<b>'); document.write(i); document.write('</b>'); document.write('</td>'); //Вставляем непосредственно результаты умножения for (var j = 1; j<10; j = j+1) { document.write('<td>'); document.write(i*j); document.write('</td>'); } document.write('</tr>'); } //Закрываем тэг table document.write('</table>'); </script> <xmp> <p>3. </p> <xmp><body> <table border = "2"> <script> for (var i = 1; i<5; i = i+1) { document.write('<tr>'); for (var j = 1; j<4; j = j+1) { document.write('<td>'); document.write(Math.random()); document.write('</td>'); } document.write('</tr>'); } </script> </table> </body>

4.

<script> var r; var summ = 0; while (summ < 4) { r = Math.random(); summ = summ + r; document.write('r = '); document.write(r); document.write(' summ = '); document.write(summ); document.write('<br>'); } </script>

5.

<script> var fact = 1; for (var count = 2; count < 6; count = count + 1) { document.write('factorial = '); document.write(fact); document.write(' * '); document.write(count); document.write(' = '); fact = fact*count; document.write(fact); document.write('<br>'); } </script>

Предыдущий параграф

Назад в содержание

Следующий параграф