## Loops

Computers are like robots. They are good at doing things over and over and over and over again.

A LOOP is when we ask a program to do something many times.

## while

The simplest loop in JavaScript is a `while` loop.

``````while (someCondition) {
// this code runs once per loop cycle
doSomeAction()
}
``````

In English this reads, "While some condition is true, do some action".

## while true

To loop forever, set the condition to `true`:

``````while (true) {
// this will loop forever
// because `true` never changes
console.log("Hello");
}
``````

This means "While `true` is `true`, say 'Hello'".

`true` will always be true, so it loops forever.

To stop the loop, hold down the CONTROL key and press the C key, CRTL+C.

This is called an infinite loop.

## One Infinite Loop ``````1 Infinite Loop
Cupertino, CA 95014
``````

## Counting Forever

Let's write a program that counts forever.

Put this in a file called `count.js`.

``````let count = 1;
while (true) {
console.log(count);
count = count + 1;
}
``````

Run the program with `node count.js`.

Remember to CRTL+C to stop the program

## LAB: Count to One Hundred

Next, change your `count.js` program so that it count 1 to 100.

``````let count = 1;
while (/* count is less than or equal to 100 */) {
console.log(count);
count = count + 1;
}
``````

## Solution: Count to 100

Hint Remember, a while loop only runs while the check evaluates true
``````
while(/*this expression is true...*/) {
// ...do this action
}
```
```
Solution
``````
let count = 1;
while (count <= 100) {
console.log(count);
count = count + 1;
}
```
```

Did your program stop at 100, 101, or 99?

## While Loops

• The `while` statement keeps checking the test expression

• if it's `true` then it loops back
• if it's `false` then it stops looping and goes on to the rest of the program

This is fairly complicated, so let's stop here and make sure to understand everything that's happening in this little program.

## While breakdown (pt.1)

``````let count = 1
``````

creates a variable named `count` and sets its value to `1`.

``````while (count <= 100)
``````

starts a loop and immediately compares `count` to `100`.

`1` is less than `100`, so the expression is `true`, so we continue with the block of code starting with the `{`.

## While breakdown (pt.2)

``````  console.log(count);
``````

prints the current value of count.

``````  count = count + 1
``````

increments the `count` variable... it was `1`, so now it's `2`

``````}
``````

goes back to the `while` line and checks again

## While breakdown (pt.3)

``````while (count <= 100)
``````

compares `count` to `100`.

`2` is less than `100`, so the expression is `true`, so we continue with the loop.

Eventually, `count` becomes `101`, and the `while` expression is `false`, and so we stop looping and go on.

## Break in a While Loop

The magic word `break` stops looping immediately.

Here is another way to count to 100, but this time using `break`:

``````let count = 0;
while (true) {
console.log(count);
count = count + 1;
if (count > 100) {
break;
}
}
``````

## For Loops

The `while` loop is simple, but there is another loop called a `for` loop that combines multiple operations within the `for` statement.

``````for (let count = 1; count <= 100; count++) {
console.log(count);
}
``````

## For Loops with Arrays

A `for` loop is often seen paired with an indexed data structure known as an Array

``````let poemLines = [
'Roses are red',
'Violets are blue',
'Honey is sweet',
'And so are you'
];

for (let line = 0; line < poemLines.length; line++) {
console.log(poemLines[line]);
}
``````

JavaScript.info Guide for Arrays

MDN Guide for Arrays

## For Loop Breakdown (pt.1)

We are using the for loop to get each item in the Array collection `poemLines`

``````let poemLines = [
'Roses are red',
'Violets are blue',
'Honey is sweet',
'And so are you'
];
``````

## For Loop Breakdown (pt.2)

The `for (...)` part of a `for` loop is where the loop:

1. Initializes a variable to track
2. Determines whether to run again
3. Changes the variable after the loop runs.
``````for (let line = 0; line < poemLines.length; line++)
``````

## For Loop Breakdown (pt.3)

Think about the three parts as three separate lines of code.

1. Initialize a variable to track
``````let line = 0;
``````
1. Determine whether to run again
``````line < poemLines.length;
``````
1. Change the variable after the loop runs
``````line++;
``````

## For Loop Breakdown (pt.4)

The `body` of the loop is the code that runs on each time through the loop

``````for (let line = 0; line < poemLines.length; line++)
/* everything inside the curly braces is the body */
{
// this code will run each time we loop
// since `index` changes each time,
// a different poem line is printed each cycle
console.log(poemLines[line]);
}
``````

## LAB: One Potato

Now let's apply what we have learned about `while` and `for` loops to print a poem in JavaScript.

Remember this poem?

``````1 potato,
2 potato,
3 potato,
4!
5 potato,
6 potato,
7 potato,
More!
``````

Please write a program called `potato.js` that prints that poem, using loops.

(No, you can't just print the entire poem as a single string; that would be cheating.)

## Counting Potatoes Solution (pt.1)

Let's separate the solution into two parts.

Create a function `poemLine` does only one thing; create the correct string for a given line number.

Solution
``````
function poemLine(lineNumber) {
if (lineNumber === 8) {
return "More!"
} else if (lineNumber === 4) {
return "4!"
} else {
return lineNumber + " potato,"
}
}
```
```

## Counting Potatoes Solution (pt.2)

The second part of the solution only loops, based on a counter `lineNumber`.

Solution
``````
function poemLine(lineNumber) {
if (lineNumber === 8) {
return "More!"
} else if (lineNumber === 4) {
return "4!"
} else {
return lineNumber + " potato,"
}
}

// New Code Below

let lineNumber = 1;

while (lineNumber <= 8) {
console.log(poemLine(lineNumber));
lineNumber = lineNumber + 1;
}
```
```

## Counting Potatoes, alternative with `break`

Another solution using the `break` to stop looping after eight cycles.

Solution
``````
function poemLine(lineNumber) {
if (lineNumber === 8) {
return "More!"
} else if (lineNumber === 4) {
return "4!"
} else {
return lineNumber + " potato,"
}
}

// New Code Below

let lineNumber = 1;

while (true) {
console.log(poemLine(lineNumber));
lineNumber = lineNumber + 1;
if (lineNumber > 8) {
break;
}
}
```
```