# Занятие 3. Циклы и массивы.

## Отладка

**Developer Tools** содержит в себе множество средств отладки кода. Для хорошего понимания управляющих конструкций (**условий** и **циклов**) полезно
разобраться с **пошаговой отладкой** - выполнением кода по шагам. Это позволяет увидеть, какие блоки кода выполняются или не выполняются в условных 
операторах и каковы значения переменных в каждый момент времени выполнения кода.

Для начала пошаговой отладки устанавливается **точка останова** - строка кода, с которой обычный режим выполнения прерывается и начинается отладка по шагам.
В **Developer Tools** найдите вкладку *Source*, в ней свой файл c кодом, и кликните на номере нужной строки слева от текста кода. 

Если вы используете <http://repl.it>, другие **онлайн-IDE** или **console** для большой части кода, то у вас будут определенные сложности с нахождением 
вашего кода и строки в нём. Поэтому вы можете вставить ключевое слово **debugger** в ваш код - это работает так же, как **точка останова** на 
строке в Developer Tools.

### Отладка по шагам.

**Пошаговая отладка** позволяет детально заглянуть в процесс выполнения вашего кода - вы можете узнать всё ли работает так, как нужно, в любой строке и таким
образом упростить поиск логических ошибок в коде. Основные операции:
- **Step over next function call** (**F10**) - следующий шаг/оператор в вашем коде. После выполнения каждой команды вы можете ознакомится со значениями
переменных, наведя на них курсор мыши, написав их в консоли, или же используя вкладку Watch
- **Resume script execution**, (**F8**) - переход из режима отладки по шагам в обычный режим выполнения кода. Таким способом вы пропускаете хорошо отлаженные 
части кода. Этот режим может быть прерван следующей **точкой останова** или ключевым словом **debugger** в коде.

### Пошаговая отладка и консоль.

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

### Задание 1

Поиграться с вашим ДЗ, добавив туда точки останова, и посмотреть, чему равны переменные и как ведут себя if и switch в зависимости от значения переменных.

## Циклы.

**Цикл** - последовательность операторов, которая повторяется.

**Цикл** состоит из: 
- тела цикла, т. е. блока кода, который повторяется, 
- условия, которое проверяется перед очередным повтором цикла.

Однократное выполнение тела цикла называется **итерацией**.

### Ключевые слова **break** и **continue**.

Эти ключевые слова применяются в теле и позволяют изменять логику работы цикла:

- **break** обрывает выполнение цикла в любом месте тела  - программа продолжается после цикла;
- **continue** обрывает выполнение текущей *итерации* и начинает следующую итерацию.

### Цикл **while**

Цикл **while** выполняется, пока условие истинно и прекращает свое выполнение как только условие становится ложно:

```javascript
var password = '';
var rightPassword = 'qwerty';

while (password != rightPassword){ //Пока пароль не равен верному...
	password = prompt('Введите пароль:', ''); //спрашивать пароль
} //возвращаемся на while (....)
```

Цикл **while** в некотором смысле схож с **if** - тело выполняется если условие верно; однако **if** выполняет тело однократно, а **while** выполняет
тело *пока* условие верно.


#### **break**

```javascript
var password = '';
var rightPassword = 'qwerty';

while (password != rightPassword){ //Пока пароль не равен верному...
	password = prompt('Введите пароль:', ''); //спрашивать пароль
	if (password == null){ //пользователь нажал отмену...
		break; //прерываем цикл
	}
}
```

#### **continue**

```javascript
var user 	  = '';
var rightUser     = 'admin';
var password 	  = '';
var rightPassword = 'qwerty';

while (user != rightUser || password != rightPassword){ //Пока пользователь не равен верному или пароль не равен верному...
	user     = prompt('Введите имя пользователя:', ''); //спрашивать пользователя
	if (user != rightUser){ //нет смысла спрашивать пароль, если пользователь неверный, поэтому...
		continue;      //новая итерация.
	}
	password = prompt('Введите пароль:', ''); //спрашивать пароль
}
```

### Цикл **do ... while**

Этот цикл называется циклом с *постусловием*, то есть проверка условия выхода из цикла происходит не *перед* а *после* выполнения тела цикла. Таким образом,
цикл с *постусловием* выполняется хотя бы один раз. Для нашего примера этот цикл подходит лучше, чем обычный **while**. Почему?

```javascript
var password = '';
var rightPassword = 'qwerty';

do{ 
	password = prompt('Введите пароль:', ''); //спрашивать пароль
}while (password != rightPassword) //Пока пароль не равен верному...
```