We're back with a program 
that prints out my array of friends.

But there's something 
that really annoys me about it.

Every time I add a new friend 
to the array, I have to add

a new text command down here.

So let's say I add Winston.

Well, he doesn't automatically show up.

If I want him to show up, I have to go 
and say <i>text(myFriends[3]</i>,

and then change the y position 
and then we see Winston.

So that's way too much work.

I just want it so that every time 
I add someone else to the array,

it does the text command automatically.

Well, do you remember 
when we learned loops?

Loops were a great way 
to repeat the same bit of code

many times in a row.

Like, if we wanted to have 
a bunch of trees in a row

or a bunch of balloons.

Well, as it turns out, loops are also 
a great way to run a bit of code

on each element in an array.

In fact, you'll use a loop almost 
every time you use an array.

They work really well together.

So lets use a loop to display 
my friends' names, instead of having

all these text commands 
to show you what I mean.

So we'll start with the three questions 
we always ask ourselves

when we're making a loop.

First, what do I want to repeat? 
Well, look up here. What's repeated?

The text command.

What do I want to change each time? 
Well, let me just look

and see what's different, the y position 
and the current index, right?

So the friend num and the y position.

And how long should we repeat? 
Well, we keep going

until there are no more friends.

So now we know what we want, 
and we can make our loop.

We start off with a counter variable 
to keep track of where we are in the loop.

So we'll say <i>var friendNum = 0;</i>

We're going to start with zero 
because remember that 0

is the first element in the array, not 1.
Then we have our while loop.

So we'll say 
<i>while(friendNum < my friends.length)</i>.

So we're gonna compare the current 
counter variable to the total number

of things in the array.
Inside the loop, that's where

we use our text command.

So we say, <i>text(myFriends[</i> 
and then here, instead of a number,

we're gonna put <i>friendNum</i> 
because friendNum represents

the current number.

And then we'll just put 
one position for now.

This has given us a little infinite 
loop error because we haven't

actually changed anything 
about friendNum.

Remember, we need to increment 
friendNum each time, otherwise the loop

will go on forever 
because that condition's always true.

I see something happened. 
Let me comment out the old code

so I can really see what's happened.

What we have is we've showed 
all the names,

but they're all on top of each other.

So, we need to change our y position.

Let's just say 'friendNum*30'.

That's good but Sophia's off the screen 
and Sophia's not going

to be very happy if she finds that out.

So, let's just add 30 to that. 
So now they're all offset by 30.

Beautiful! So now you see we have 
a loop displaying our array.

And that means if we add more people
like OhNoes Guy, or maybe even Sal,

if I just add him to the array 
then Sal will be my friend.

Awesome! Now he's my buddy.

And you see that it just automatically 
shows the new friends

because it's always going 
through the whole array.

So we can delete our old code. 
We don't need that anymore.

And let's just go through 
this code here and review what it does.

So we start off 
with friendNum equal to zero.

We check to see if friendNum is 
less than the current length.

So you imagine zero is 
less than six. That's true.

So then we go inside here 
and we say text, my friends friendNum.

So that'll be my friends zero, 
the first time.

And then 30 plus zero times 30.

So it displays Sophia at 10 and 30. 
That's what it does.

And then friendNum++. 
So then it becomes 1.

And then it goes back around 
and says, "Ok, is 1 less

than myfriends.length? 
Yeah, it is."

And it keeps going, 
keeps going, keeps going.

And then finally we get to Sal. 
Remember, Sal is actually

the sixth element in the array, 
but he's index 5, since we start at zero.

So, is five less than six? Yes.

So it displays myfriends five.

And then it becomes six 
and we say, "Is six less than six?"

No. It's equal.

So this'll be false. 
So it will never display the sixth element

which is good 
because there is nothing in index six.

There's a sixth element, 
but nothing in index six.

it can be really confusing, 
the fact that it's zero and one

and doing all that 
but you'll get the hang of it.

All right, so that's our loop.

Now, if you want to, you can 
actually use a for loop

as well if you prefer for loops.

For for loops, we'll just say, <i>for</i>,
and then, <i>var friendNum = 0;</i>

and then we have our condition

<i>friendNum < myFriends.length</i>

and then our increment: <i>friendNum++</i>

and then inside the for loop, we can 
just put just this line of code here.

and I'll just change the x 
so that you can see

it does exactly the same thing. 
So it's up to you which one you use,

but the point is to use a loop 
with your arrays

because it will make you so powerful.