This course has been updated! We now recommend you take the JavaScript: From First Steps to Professional course.

Check out a free preview of the full JavaScript: From Fundamentals to Functional JS, v2 course:
The "Looping Solution" Lesson is part of the full, JavaScript: From Fundamentals to Functional JS, v2 course featured in this preview video. Here's what you'd learn in this lesson:

Bianca walks through the solution with the help of students.

Get Unlimited Access Now

Transcript from the "Looping Solution" Lesson

[00:00:00]
>> So our task is to loop through the suspects array.
>> So I named a function foo.
>> Okay.
>> Like that?
>> Yep, brackets. Set up a for loop, so for. Let i = 0. [COUGH]
>> Okay.
>> i is less than game.length,
>> Okay.
>> i++.

[00:00:34]
>> Great, what does this kind of loop do?
>> It's going to advance through the members of the array.
>> What does this mean right here?
>> It declares the sort of iterative variable and starts it at 0. And then, well, go through that number of the members of array a specified by the length of the array.

[00:01:09]
>> Yeah, so while this is true, it will increment by 1.
>> Yep, that's right.
>> Cool, why did you choose this kind of loop?
>> Because don't really necessarily know the number of the members in advance. So if you added any, it would be dynamic based on its length, basically.

[00:01:38]
>> Yeah.
>> So if you ever add in members to the array, it would still be workable.
>> Got it.
>> So, console.log, game[i], and then semicolon.
>> Cool, What do we think? Is it gonna work?
>> I think it's gonna log suspects, if you do a call function.

[00:02:18]
>> Do you think it's gonna log suspects?
>> Yeah, cuz we called it.
>> It didn't call the function there.
>> Yeah, so we didn't call the function, that's a problem. And then when we call it, we're gonna loop through. And you think it's gonna call suspects, why?

[00:02:43]
>> Cuz I was just playing around with it, and I think that's what happened to me. But I think, yeah, at that first level of the game object, the only thing it has is this object suspects which is an array. So, at that level of game dot whatever, there's only suspects, so there should be a length of just 1, and it will return that array of objects.

[00:03:09]
>> Got it. I see what you're saying. But it's an object, so object doesn't have a length. So that's a problem. For the very first time that this loop runs, what is i? How about checkered flag?
>> I is me.
>> [LAUGH]
>> I get it, [INAUDIBLE].
>> The game object itself.

[00:03:51]
>> Where are we saying that i is the game object? What line?
>> 14?
>> Because, yeah, 15, console.log(game[i]), at that point i is, Actually, i is, game.length is going to be,
>> If you said type of i, what do you think it is supposed to be?
>> Number?

[00:04:29]
>> A number. Do you see where we're assigning it to a number?
>> Yeah, on line 14, where you're saying let i = 0, 0 is a starting iteration number.
>> Yeah, so at this line, this is where we are defining i. And we're starting it out at 0.

[00:04:48] So, the very first loop, what do you think i is?
>> [INAUDIBLE].
>> Where we're setting it, i?
>> Well, yeah, I'm sorry, 0.
>> 0?
>> Yeah.
>> Yeah, so i is 0 on the very first loop. So then is i less than game.length?
>> So is game.length undefined or is it 0?

[00:05:14]
>> I think it's undefined.
>> So, [COUGH] we could fix it by game.suspects.length.
>> Okay. And now.
>> And now we'll have a length then because it's an array.
>> Yeah.
>> Not an object.
>> And then game[i], right? So i is 0, we can kind of replace it like that.

[00:05:35] What is game

[0]?
>> Game

[0] should be-
>> Shouldn't it be game.suspects?
>> Because there is no games at 0, yep, perfect. Awesome. Any questions about that and how that works? So this is a little tricky. It's like one of those, like easy things that people give magic to when really it's telling you everything that it's doing.

[00:06:16] So we're defining where our start variable is, right? We're giving it a condition while this condition is true, and then every loop do its thing, right? And it's gonna increment, you can increment it multiple times or whatever. So there isn't anything magic happening here. We use them a lot with arrays.

[00:06:41]
>> Is it a fair game to also use map.
>> You could use map if you wanna return an array. Yeah, in the next slides after this, we do each and map. Yeah, awesome. So where was I? Yeah, so there's no magic here. Why do we use this kind of loop with an array?

[00:07:06] And would you use this with an object?
>> Well, with an array, arrays have numerical values associated with them. So they map well onto the way this iterates.
>> Yep, exactly, and that's it. So this loop has really nothing to do with arrays. We have a for end loop, Right, which is actually for objects, right?

[00:07:37] Which has a special relationship, but this for loop is just doing math, it's very straightforward. Cool, any questions?
>> Could you also use brackets, so it would game.bracket strings suspects.length, would it- [CROSSTALK]
>> Yeah, you could also do that. I don't recommend using brackets when you don't have to.

[00:08:06] I use it in my examples just to remind you that that's a thing that exists, but in general if you can do a dot, it saves you four or so keystroke, I think that's best. And we have to use brackets here, why?
>> Me?
>> Hm-hmm.
>> Because, Well, because, I guess you could use a dot if key was a property on the objects, but in this case, it's not a property of it.

[00:08:51] It's just a variable.
>> Yep, what's the giveaway that it's a variable? Yeah, let.
>> Let, yeah, my bad.
>> Yeah, I mean you can leave this off, to be honest, but that's the giveaway. And you could change this, To whatever you want. It's just a variable name.

[00:09:16] I like to show that by just calling it pickle. Pickly, that's what it's gonna be. It just needs to match, awesome.