JavaScript с нуля
- Автор: Кирупа Чиннатамби
- Жанр: Образование
- Дата выхода: 2021
- Цикл: Библиотека программиста
Читать книгу "JavaScript с нуля"
Цикл for
Один из наиболее популярных способов создания цикла — это использование инструкции for. Цикл for позволяет повторять выполнение кода до тех пор, пока заданное нами выражение не вернет false. Разберем наглядный пример.
Если преобразовать прошлый пример с saySomething с помощью for, он будет выглядеть так:
for (let i = 0; i < 10; i++) {
saySomething();
}
function saySomething() {
document.writeln("hello!");
}
Если вы хотите сразу испробовать свои силы, попробуйте вписать следующий код в тег
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Loops!</title>
<style>
</style>
</head>
<body>
<script>
for (let i = 0; i < 10; i++) {
saySomething();
}
function saySomething() {
document.writeln("hello!");
}
</script>
</body>
</html>
Когда документ будет готов, сохраните его и выполните предпросмотр в браузере. На рис. 5.1 показано то, что вы увидите после загрузки страницы.
Рис. 5.1. Слово hello! повторяется слева направо
Слово hello! повторится десять раз по всей странице. Это стало возможным благодаря циклу for. Поэтому в виде благодарности за полученный нами опыт изучим все аспекты работы цикла. А вот и наша звезда:
for (let i = 0; i < 10; i++) {
saySomething();
}
Это цикл for, и он существенно отличается от тех инструкций, с которыми мы познакомились к этому моменту. Для понимания отличий представим цикл for в обобщенном виде, как показано на рис. 5.2.
for (start_point; condition; step) {
// код для выполнения
}
Рис. 5.2. Общий вид верхнего уровня цикла
Далее верхний уровень сопоставим с действительными значениями из нашего примера (рис. 5.3).
for (let i = 0; i < 10; i++) {
// код для выполнения
}
Рис. 5.3. Действительные значения
Каждая из этих трех разноцветных секций (стадий) играет свою важную роль в процессе выполнения цикла. Чтобы использовать цикл for грамотно, необходимо понимать, за что отвечает каждая из секций. Рассмотрим каждую подробнее.