Class 20: Practice with JavaScript Arrays

Introduction

Yo. Hey. Yo. Hey, what's going on, everybody? Good morning. Good afternoon. Good evening. No matter where you're coming from, hope you all are doing well. You know what? Like it just doesn't get old. Sometimes I come to the come to the desk and I'm like, all right, time, time to get into it. Time to teach it, teach. And then the, that, that song comes on and you feel it. I don't know. It does something.

Gets me going. What's going on, everybody. Welcome back. Hope you're doing well. I know, I know we, uh, we did a raise on Tuesday, so I'm glad that you're still here with us on a Thursday because it can get a little rough in the beginning, but proud of every single one of you that come back time and time again. When HTML hit you, you showed back up. When CSS came at you, you showed back up. When JavaScript got weird and looked a little bit like math, you showed back up. That's how you get to the promised land, folks. You keep pushing, we're gonna push, we're gonna review. We're gonna push, we're gonna review. So we pushed a lot on Tuesday. I know, we pushed a lot on Tuesday. And now we're gonna come back. We're gonna get our active recall in, our spaced repetition in.

We're going to carry these boats. We're going to carry these logs and we're going to get there together Alrighty folks Glad to see you're here Thank you macro we go glad to see you're here glad to see you're doing well we got we got some fun tonight we're gonna We're gonna go back to some basic functions and then we're gonna see a raise all over again From the beginning we're gonna cover each topic again, but this time we're gonna do slightly different examples We're gonna see it from slightly different angles. We're gonna take our time. We got questions. We're gonna answer those questions I know when we get to a raise it's the point where There's a lot of substitution. There's a lot of this equals that and it can get a little tough The reading can get a little tough But guess what? We're we're fucking tough. So we're gonna get through it already folks Glad you're here. Glad you're here. Let's jump into it. You know, I like to do it We're always going to start off with some questions. You got some questions. I got some answers. The question of the day. And this comes from the office episode, the Hillary Swank episode, a raise hot or not.

Throw it in chat for me, please. Hot or not. A raise, please. Hot or not. Hot meaning they're feeling okay. Not meaning not so much. Had a lot of hots. Had a lot of hots. A lot of spices, so hot. Fetch, should we say they're fetch? Nice, tepid. Lukewarm. A lot of hots though. Okay, I see you. A few knots here and there, that's all right.

That's what tonight's for. A few knots, that's okay. It's good to feel a few knots here and there. Means we're gonna get, we're gonna, tonight's gonna be value to a lot of folks. Beautiful. All right, we got some hots, some knots, beautiful. Fetch, is it gonna happen? and I'm gonna make it happen. Alrighty, folks. Questions, you got questions, I got answers. Always like to give folks a few seconds to get in here. So if you got some questions, I got some answers. Are they really called curly brackets? It's, there's a couple different names for them. Figure braces, figure brackets, curly braces.

People call them all different things. I like to call them curly braces. Cause it's a dope thing to do and I do dope things. Is Domino's sponsoring the stream? Who's the sponsor? Well, the sponsor we announced on Tuesday is Microsoft coming for our Git and GitHub class. So Microsoft showing out for our getting github class if you don't know Microsoft bought getting github And so I sorry bought github and so they're sponsoring our class that class will be on the 31st So end of this month is our get class and github is sponsoring it Microsoft's coming through lots of swag. We're doing laptops. We're doing it big if you've never been here for a sponsored stream before We go out so it's gonna be fun. We're gonna learn a lot We're also gonna have a lot of fun a lot of raffles and a lot of cool stuff We'll be Bill Gates give us a tour of his magic toaster, I mean we can ask right What is your opinion on DevOps is it possible for us to move into a DevOps position it's a whole other It's a whole other beast what we do as software engineers, we write the code. Everything from when we're done writing code to it going live on servers, staying up, making it easy for developers to get their code live and all the tools and systems behind that, that's DevOps. So it's a whole kind of different beast. It's a whole other skill set you would have to learn if you wanted to go into that area. A really great streamer here on Twitch is Mastermind and they do a lot of more DevOps-y stuff. So if you're ever interested in that kind of thing, I would definitely check out some of their streams.

They actually did a boot camp, but they were like in-person and they streamed the in-person DevOps boot camp, which is pretty cool You know Is there a creator provides product management with software engineering yeah engineering management or just technical project management So there are technical PMS that maybe aren't slinging code every day, but understand enough to be able to advocate for their team effectively Oh, they're starting a new cohort muck. All right. I'll have to find out some details so I can share it with folks. Can we do some fundamental code wars together? We will. Uh, so Blau did an amazing article on getting code wars set up and then how to do a code wars. Uh, so I shared their article with the last message on the follow materials channel and then I'm going to share their next like their like how to do it video. They actually did like one live on the video, so I'll share that after class and then we'll do some code wars together live as well. We're going to make a little game of it, which I think will be fun. Yeah. Alrighty folks, let's get into it. A lot of review tonight. I really want to make sure where we can take our time and go into detail, spend a lot of time making the nuns angry, doing some diagrams, trying to make arrays sink in a little bit better, make a little bit more sense. We got lots of other cool examples to get through, lots of fingers on keyboard practice tonight. But please, ask questions as we go through this.

Now, if you haven't already, please go ahead and check in, exclamation point, check in here in, Indifferent said, Leon, I'm the fullest stack. I got DevOps, backend, frontend, DBs, ML, AI, blockchain, UI, UX, mobile, desktop. That's why I need to go Indifferent. We know why. So if you haven't already, go ahead and check in for me, please, it really does help folks find us. We might've scared a few folks away on Tuesday, so let them know that we're running back a race tonight, and so they can come back and get the help that they need for things to click a little bit more. So if you haven't already, please, I really do appreciate it, check in. I also the review class is up on YouTube so our super review is back up on YouTube. I fixed the weird error that was there So if you want to watch the super review it is on YouTube. You can do exclamation point YouTube and Watch it. It's nine good hours. I don't know. No, it'll be cool If you ever if you do watch it, please give it a like just so that more folks can find it I think it could be a really good entry for folks that wanna try out 100 devs. And so go ahead if you haven't already, please give it a like when you watch it and just leave it running. If you gotta go do errands or something, just let it run.

Let YouTube think that you're still there, you know? Let it run, that way it gets served out to more folks. It's a nine hour class. You can let it run, it's all right. Leave it in the background. You need, instead of listen to lo-fi, right? Instead of listening to lo-fi, You can just put that nine hours in the background. Let, let my, uh, my sweet sounds kind of enable you to, to, to get work done. Alrighty. There was a band that did that. I don't actually know if I can actually ask you to do that. There was a band that, um, made a, it was a, it was, I forget what the name of the band was, but they made an album that was just not, there was no noise. It was a full album, but there was no sound and they asked all of their, all of their fans to just play it at night, right. And play it at night so that, so that they would go up the Spotify rankings. I always thought that was a really cool idea.

Um, Leon trying to make that YouTube money. It's not monetized folks. The YouTube is not monetized. They know I just really want people to find it. And so that's why I asked you to like, um, just so that folks can see it. I really do think it's a good way for folks into 100 devs and so yeah They're called wolf pack that's the name of the band that's funny that yeah They made 20k before Spotify stopped them That's funny alrighty so This one's a tough one I need a I need a little bit more time so I have the best news I could ever share. It's the best news I could ever share. It's something that I am immensely excited for, immensely proud of. It is the biggest announcement that 100 devs has ever had. And so I really wanted to do it tonight and I can't do it tonight cause I had some unfortunate stuff happen yesterday. So I need a little bit more time. and we're gonna do it on Tuesday. But I also was, I've been debating for a while to say like what happened, but I'm gonna say it because I want somebody, if they're here, to understand something and then we're gonna move on. So my wife is also an educator. And last night, one of their students was, unfortunately, and this is a trigger warning, if you, the next few seconds could be a little, could be some bad news, so I'm just gonna give folks 10 seconds to mute me, I'll say it quick and then I'll turn it off.

So unfortunately, one of my wife's students was shot and killed and so we just spent the night together and just my time that I would have spent to prepare for today, that didn't happen. So I spent the night with my wife just being together and unfortunately that's not the first time and we've had to do that. And so I know this learning to code stuff, it's fun. I know that it can mean a better life for you and your family, but for a lot of people, for a lot of my past students, it's a way out. It's a way out to a life that can be very, very dangerous. And so if you are here and you need that way out, I got you. We'll make it happen. You let me know that that's what you need. I got you. So I wanted to put that out there because somebody might need to hear that tonight. And I hope that you take it to heart. I hope that you put in the work. The hustle that you use can be a hustle that can help you on the way out. And so I wanted to put that out there and give me a little bit more time on Tuesday. We'll do it, right?

We'll do it big But need a little bit more time a little more time All right also We had a lot of a lot of other kind of things that had that I was gonna announce today, too So we we still have some fancy stuff to announce on Tuesday as well Zeus, thank you for the gifted subs, I appreciate you. The fancy stuff, we have the, of course, best, funniest portfolio, and sorry, not the best, the funniest portfolio and the funnest project. We'll announce those on Tuesday as well, and we'll announce the color from Tuesday as well. So a lot of stuff coming up on Tuesday, I need a little bit more time. And as always, if you wanna be fancy, If you want to be fancy, please, um, make clips, the clips have been great. All right. The, the, I appreciate the gift itself, but not, not now, please. It's this, this, not, it's not the reason I share those things. And so I appreciate the love, I appreciate your support, but, but not right now. Yeah. Thank you. So the way you get the fancy color, right? The way you get the fancy color, the yellow, right? The golden yellow is if you make the best clip. Now the best clip, right?

It can be a fun clip or it can be an educational clip. We're picking both. So one person that got the golden color so far picked out a funny one and then one person that did an educational clip Got it as well. So best clips get a fancy golden color. If you want to stand out on discord, that's your way Well, I always share a slido after each class for you to to post this clips in yeah Tony I got you Alrighty now on Tuesday. We picked it up On Tuesday, it got a little spicy. Some things are starting to come due and the hard part right now is yes, the code, but it's also the time management, right? It's the stuff that you have to do each week. The networking is becoming a thing. The coding challenges are becoming a thing. The reading is getting a little bit more intense and a little bit more is gonna be asked of you as we start to progress through the bootcamp, right? And so you have the paid client as well. And so as the JavaScript gets a little bit harder, and as you have the networking, as you have the coding challenges, as you have the paid client, that all starts to ramp up a little bit, right? It all starts to get a little bit more tough. And so I just want to make sure that we say it that as it turns up.

It's okay We understand that you're going to be It takes a little while to get up to speed. Remember, it's a it's a marathon not a sprint, right? It's a marathon not a sprint if you need to take a little bit more time to get your networking up to speed That's okay if you need to take a little bit more time to get the daily challenges into your into your daily routine, that's okay. If you need the time to focus on the reading, that's okay. At this point in our adventure, you have to start figuring out how you're gonna manage your days and what you need to invest more or less in, that's okay. And as we start to kind of keep going, it does get easier. It does. The first couple of weeks is a it's definitely a shock to the system to know you have to be balancing all these things But that's the beauty of a boot camp It's one shot in your life that you put in this effort and it can pay dividends for the rest of your life The time you put into the networking will help you get a job The time you put into your client will help you get a job the time you put into the coding challenges will help you get a job. And so, as things turn up, just know that you're not alone. Just know that there's a huge community here that wants to support you. And you're running, we're all on the same rollercoaster. We're all gonna get there together. But don't be afraid to just hang on sometimes, right? Sometimes you just gotta hang on. You might not be enjoying the rollercoaster, but you're on it, right?

You're just gonna be Beyonce, you're gonna hold on, and we're all gonna get there together. I want to do a live portfolio and resume review. And so folks are starting to work on their portfolios. They're starting to, we haven't fully done our resumes yet, but people are starting to work on them. And so I want to do a class where we go through a bunch of them live. So if you want the opportunity for me to do yours live, like share it live, like I'm going to roast you just a little bit, like not a lot, it's a little bit of roast, right? A little bit of heat, right? So if you, if you want, if you want your, your portfolio and resume for me to give you a critique, because what really happens is the, the, the portfolios resumes I review, the same stuff comes up over and over again. It really, everyone makes the same mistakes out the gate. And so I really want to do this class just so I can show you the common mistakes that folks make and how to correct them and how to make your portfolio and your resumes past that wonderful sniff test. Right. And so go ahead. If you know, you want somebody to take a look at it and you might want to do it live, fill out that form for me and we'll do quite a few of them together. So that's a class that'll be coming up. Not, not super soon, but in the near future, just as we get closer to doing more resume and job prep stuff, is there a deadline?

No, I would say fill it out like this week. If you want the chance, I'm just going to pick a few. We're only going to do like five to 10 of them. So if you, you want to be in that, in that raffle to figure out who it is, um, go ahead and fill out that form for me. All right. As we kind of move into, we have LinkedIn classes. We will, yeah, we will have classes on LinkedIn. We'll have classes on your resume, all that professional development stuff. We have like actual dedicated class time for, um, do we need to remove personal info? I would, I'm not going to like edit anything. So whatever you share with me, I'm going to share live. So if you want to blank stuff out or things like that definitely take the time to do that Cool. We're also gonna do LinkedIn reviews all that fun stuff, but that's a little bit later right now Our goal is kind of coding and networking and coding challenges as we a little bit further along We'll switch gears and worry about that professional development stuff pretty heavily All right Another thing you're gonna start noticing is that in class things are to be getting a little bit harder a little bit more spicy if you're not doing the reading. I'm going to assume that if I give you a week to get reading done, that you've done it. Now, it doesn't mean that we won't review the important concepts, doesn't mean that we won't make things hopefully make a little bit more sense, but I'm gonna start giving videos and reading that I expect to be done within that week so that we can go a little bit faster during class.

We're at the point where we need to speed up just a little bit to get to the end at the right time. And so we're going to kind of pick up the pace a little bit. And there are gonna be a lot of things that you're gonna have to research on your own. And there'll be some things that I'm gonna ask you, I'm gonna say, hey, we're gonna be using these methods, but I'm not gonna give you the resources for the methods. Or I'm gonna give you, hey, we're gonna be covering this topic, but I might not give you the resource for that topic. And the reason I'm doing that is because I need you to start getting comfortable with the idea of being uncomfortable on the job. Right once you're on the job there often won't be tutorials there often won't be Videos or even books or anything that will help you with that stack and you have to get good at researching things on your own So know that there will start to be a few gaps as we pick up the pace a little bit That's intended for you to fill in those gaps to do the research to look things up Even some of the practice problems will be doing during class I feel a little bit like a jerk when I have to say it But a lot of the, some of them are going to be like, Hey, here's this thing we've never heard of. And in that moment you have to go to the MDN or you have to look, I just need you to develop that muscle. Right. So that when you're on the job, you don't panic. You've been used to it. We've been doing that for weeks, months. Right. So know that that's coming the first couple of times. I'll be really obvious with it.

I'll really point it out, but know that that's where we got to pick up that pace a little bit. Yeah. Alrighty. Welcome to the Trough of Sorrow. I feel like most of us are here. Let's do a poll real quick. I just wanna know. Let me start a poll here. New poll, are you in the trough? Yes or no? All right, we're gonna do a one minute poll here. Go ahead and say yes or no for me please. You Totally fucked is not a yes or no, but I see you All right We're at about 75% of folks are in the trough of sorrow and about 25% of you are not. That's the right place. That, that to me is like a good, a good spot to be.

And I think it's really important for everyone to see that those results, right, to see that result. Beautiful. this is it over a thousand people took this poll over a thousand people took this poll 75% of you are in the trough of sorrow and 25% of you are not don't feel bad for being exactly where you should be this is from blah me and blah we're talking Wednesday and this came up and I really thought it was so important that we had to that we had to share it in class. So this, this is from blah. You shouldn't feel bad for being exactly where you should be. You should be in the trough of sorrow by now. We don't, right. You, you should be in the muck. It, you should be, you should be in the goo. You should be looking around and being like, I don't know what the fuck Leon is talking about. I don't understand. He's, he's, he's drawn all these arrows, but I don't know what those arrows mean. I don't know what that, that arrow from that, I like I, what I I'm here, but I don't know what I stands for, right? Like you should be in the trough of sorrow and you're going to see that 25% feel like they're not. And it's really, really difficult, really difficult for when you're in the trough of sorrow, where you should be to see folks that might not, they're like, You're you're you're at the bottom in the muck and there are still some people coming down the roller coaster and they're having fun They're yelling.

They're wooing. They got their Beyonce hair flowing right there. They're doing the they're doing the most right you're in the muck But you're seeing folks still coming down the hill Right, they're gonna crash into the trough to don't let their fun. Don't let their fun get you twisted, right? They're gonna they're gonna crash into the trough of sorrow, too you're there, they're coming down behind you. Don't get it twisted. Because here's what happens. When we start doing daily coding challenges, some folks do the most. They can't help themselves. They're flexasauruses, right? They just have to flex, right? They do a couple code wars, they're up in the Hamilton channel, they can't help themselves. It's okay, and this is you. That's okay, don't let me block your shine, right? But we got a lot of flexesaurus, about 25% of us are flexesaurus, right?

And so we have to realize that if you're in the trough, it really sucks to look around and see folks still wooing at the top of the hill, right? And so what I really need you to understand is that you shouldn't feel bad for being exactly where you should be, right? If, if, if arrays aren't making sense, that's okay. If JavaScript's not clicking, that's okay. If the coding challenges look like gibberish, that, that, that's okay. if you are still catching up that's okay you should be in the trough things should be mucky you should be doubting yourself that's where you should be so don't let the fucks-a-saurus is coming down the hill like it looks fun until they crash along with you right and so be careful we've assigned a lot of stuff that's going to make you maybe not feel the best, and that's OK. You're going to get there to where you're going to start rocking the coding challenges, you're going to get the client, you're going to do those things. But keep pushing through the trough of sorrow. You're where you should be, and you shouldn't feel bad about that. And for the flexors, that's OK, do you, right? Just be mindful that we're trying to do this as a community, right? Be mindful that folks might not be totally understanding the coding challenges yet. And so if you flex, also teach. Let's try that. You're gonna flex, teach as well, right?

If you're gonna show off the cool thing you did on the Code Wars, help somebody else understand what you just did, right? It's okay to be a flexasaurus, just we gotta pull folks along with us too. Cool? All right, thank you. Cool. Let's talk about some programming folks, talk about some programming. We're going to get, I'm a stuck assassin. That's all right. Coding gal. Nah, nah, that's not a good one. Nope. That's not you. Trophosaurus. There we go. We're all trophosaurus is all trophosaurus is we're all going to go through the trough at some point today, you tomorrow, me, it comes and goes.

All right, let's talk about some programming folks. A computer will do what you tell it to do. We know this through and through. Computer will do what you tell it to do. A program is a set of instructions that you write to tell a computer what to do. And programming is the task of writing those instructions in a language that the computer can understand. The language that we write that we understand that the computer can eventually understand which is broken down is JavaScript. JavaScript has a very specific syntax and that syntax is might be what's driving us through the trough of sorrow recently, right? That syntax is tricky. Once we start adding arrays and the square brackets and the equals this and the substitution that can get a little wild. And so tonight we're gonna practice that syntax more. We're gonna get more hands on keyboard practice. We're gonna spend more time with examples so that that syntax isn't as scary. JavaScript syntax, when we learn a new topic, sometimes it's pretty scary. Mushdoom said, Leon trying to sneak maths on us.

No, I ain't trying to sneak maths on you. There's just some substitution. A lot of development, a lot of programming is like, all right, this equals that. I'm not going to say that's quick maths, but it's something that our brains have to click over to. and sometimes it takes a couple classes for your brain to be able to click over, to be able to follow the substitution pattern, yeah. Cool. So far we've talked about variables, our data buckets, and we talked about how we can declare and assign variables. So here I've declared a variable called age, and I've assigned it the value of 25. We talked about conditionals, is another member of the big four. Conditions, if something is true, we do it inside the curly braces. If that if is not true, we check the else if. If the else if is not true, the else automagically runs. Rufiata said, hold on, they spent their highlight message. A customer told me to build an e-commerce website for them. I told them a price that they brought up.

How someone who has more experience is charging them less. For the sake of next time. How would you handle this? Tell them to go like I love that I love when clients tell me that they have somebody else that'll do it for less money here's my favorite answer when whenever a client says oh Why like I like so and so is gonna do it for cheaper the thing I in different goes as fuck you pay me That's on the list, but it's not what I say. I go. Oh Really? Like I get I do I I Do really like that that much cheaper. Can I have their name and number, please? I got a lot of projects that they're gonna do it for that price. I need their info Can I have their name and phone number, please? And then I'm dead serious. Like can I have their name and phone number and Cuz that that's oh, that's a wild price and then no, I'm serious. Can you give me that name and phone number? Thank you. I really appreciate you.

I got a backlog of projects. I could really use their help but If they don't work out You know, you can come back to me, but good luck. I can't compete with that price. Have fun. You know why? Cause a week later, they call me back. A week later, they call me back. It's almost always cap. They always call back. And if they really do have someone that's going to do it for that much cheaper, then let them do it. Let them let them go and do it at that price. Well, I'm not going to, I'm not going to like, Hey, you do you. We don't get God. We go get exactly spicy. Leon is here.

All right. We have our conditionals. We check to see if the F is true. If not, we check the else. If we can have as many else's as we want and we can have an else. If we choose to, we don't have to, but if we do, it automatically runs beautiful. Chat, what's the danger between assignment and comparison? Danger between assignment and comparison. If we're still catching up, would you recommend coming to a live class? I recommend catching up and then joining live, but watch the super review and then maybe check out a live class or two. So yeah, come watch a super review and then join a live class. Live class is fun. Yeah, one equal sign versus three equal signs. One equal sign, you're assigning a variable. Two equal signs or three equal signs, you're doing comparison.

And we always have to be careful of doing assignment inside our parentheses because it'll be what type of value? What type of value could it be? If we do assignment inside of the parentheses, what do we wind up with? Yeah, we can wind up with something that is truthy. It'll evaluate as truthy, which is pretty weird. So that's something to keep in mind if you accidentally do the assignment. Remember, we can have multiple conditions. You can check to see if your name is Leon and if your status is Bon, because if it is. Get a link at the camera Beautiful You can also do or right, you can check to see if the day is Saturday or the day is Sunday because if it is Saturday or Sunday then It is still the weekend beautiful Functions chat, what are functions what functions are we're powering through this review so we can get to the arrays Sets of instructions, exactly. Sets of instructions. Sets of instructions. Marty Cats, thank you for the gifted subs. Scam VR, thank you for the gifted subs. I appreciate y'all for being here. Thank you so much.

All righty, they are indeed sets of instructions. They're meant to be reusable, right? Meant to be reusable. The idea we write functions so we don't have to rewrite the same logic over and over and over again. We just do a function and then we can reuse that function. We can call it over and over again, cool. Oh, here we go. We have a function, the normal syntax. Chat, what is this? What did I just circle? What do we call it? I got you. Somebody's, somebody's squiggling out. They thought I was going one way. I, I, I swear if I deked them, I went a different way.

Yeah, it's a function declaration. Beautiful. We're taking that set of instructions and putting it into memory. How about this down here, how about that down there? What is this down here? Beautiful, yes, it's a function call. We're trying to make that function above run, function call. Here is the basic syntax of a function. We have our function call, when we call mom, we call to exactly nor, we call to argues, we pass in hello, which is our argument. All right, it's our argument. Our argument falls into our, what is word, chat? What is word? What's the word? Word, word. Yes.

Yes, we're on fire tonight. It's a parameter, exactly. I feel good, I hope y'all feel good. Yeah, the parameter, beautiful. Loops, what are loops? Chat, what are loops? What do they enable us to do? Yeah, they enable us to do something over and over again, to do something in a repeated manner, to repeat some action again and again, exactly. Cool, so loops enable us to repeat an action some number of time. We saw, we know that there are three main types to loops in JavaScript for while, do while. We saw for and while so far. We haven't seen a do while yet. We'll see that next week. And we also saw some other loops on Tuesday. What was another kind of loop that we saw on Tuesday?

Yeah, for each, exactly. Cool. And these different types of loops just really kind of determine when to start and stop your loops. So here's the traditional for loop. We set up our counter. we say when to stop counting, we say how much we increment each loop, and we go ahead and we can console log whatever that counter is each time. So this would print 1, 2, 3, 4. We would add 1 to 4. We're at 5. Is 5 less than 5? No. It's equal. It's not less than. And so we would stop and only see 1 through 4 printed to the console. All right.

We also have a while loop. We set up our counter outside of the parentheses and we're gonna say is zero less than five, that is true. We'd wind up printing zero and then we would increment inside of the loop. If we forgot the increment, we could run into some trouble. If we got our end condition wrong, we could run into some trouble. Running into a what? Yes, infinite loop. Loops go brr. Exactly, wonderful. Let's go ahead and do some practice problems. Let's see these big four in action, the variables, the conditionals, the functions, and the loop. So if you're new around here and you need the starter code, join our Discord and agree to the rules. You'll see a follow along materials channel. In that channel will be a zip file today unzip it and then open that code and VS code And that's what we're gonna be working on together. So Today's code is all bachelor related, but it's always the spinoffs some of them You might not have even heard of like in paradise or after paradise winter games summer games I don't know how long you've been part of bachelor nation, but you're gonna learn today.

Alright folks Let's go ahead and take a look at in paradise You're also gonna notice that there's a lot of other stuff here and that the slides go for way longer than we're gonna cover. We're just covering arrays tonight we're seeing more practice but these slides go into objects and all the code I give you comes with objects as well. So what do you think you should do this weekend or before, before Tuesday? All right. Something in my eye, you don't have that. Whoa, whoa. I forgot. We got the flexes sources in here. The flexes sources were like, do it by Friday midnight, right? No, no, just, just read ahead and read ahead a little bit. Look at the examples. I don't need you to do them. Just just read ahead a little bit Familiarize yourself with the big topics research anything that seems not in the reading that we covered right just Forgot some of you are like it'll be done by tonight. No, I don't need you to finish it tonight I just want you to look ahead a little bit see what's coming for Tuesday and Thursday see the code We're gonna work on Tuesday Thursday. That way it's not your first time We're, forgot, we're good, we're good.

All right, let's take a look at this. We got some variable practice, some function practice, some conditional practice, and a loop. I'm gonna put, let's put four minutes on the clock here and have at it. Four minutes and then we'll go over it together. You got this, believe in ya. We'll go over it together and then we'll probably take our break. This is the review in paradise. Review in paradise. Always in the slides. You always need the slides. It's exclamation point slides if you need them. But review in paradise is the one we're working on. You got three minutes, 30 seconds. What are some remotes I always forget? I always mess it up.

What's your favorite sandwich I don't know. I don't know if I have it is uh Oh, no, I don't really eat sandwiches Is a glizzy a sandwich like a vegan one at a sandwich Not sure I grew up eating hoagies. I really do like hoagies, but I don't really eat meat or cheese anymore Put some music on for you while you're working what's your opinion on pineapple on pizza you do you juice you got Automated but I have heard of them. Yes Tony Luke's has vegan hoagies now what that's wild all about Phil's on 24th Street, though I'm at four years now maybe a little bit longer but I haven't really eaten red meat or pork since I was nine. You're like, it's Phillips, but I call it Philz coffee, mouse gaming, add it two minutes to the timer. Folks. So when this hits a minute, we're going to bump it to three. We'll bump this up to three as soon as it hits one. Coffee mouse out here All right, there we go three minutes on the timer or the two minutes that we're at it Strategic the VODs are always immediately available and then everything gets uploaded to YouTube probably like a couple days later day or two later Do you take supplements? Uh, I take like a multivitamin now, but, um, and vitamin D, but the vitamin D is more for my bipolar disorder and not so much like I'm missing it in my diet. I just need way more. D5A, congrats on the offer. That's huge Back that's alright. You just gotta give yourself a little bit more time Old in a with the done Pack have you done your repetition? That's what's really helped sink this in.

Yeah Hey Nicolo, that's pretty dope A lot of folks done those extra two minutes that came in clutch. Congrats on the folks finishing a Lexington game. Explain a small client for a little JavaScript widget. That's dope. Congrats. Galaxy, hope everything's okay. When does it usually start to get better? It depends on how much time you have. Not everyone has the same privilege of time. And so some folks are able to get a little bit more repetition and it comes a little bit earlier. The best thing you can do is just ask a lot of questions jump on discord Have someone help walk through things with you. We have so many folks now that Help out on discord. If you see folks in a voice channel, don't be afraid to say hey, I'm struggling with this thing Can you show me? We have so many folks that are kind of starting to ramp up more streaming and hopefully joining the stream team Mine's been streaming a lot mine was been streaming a lot, which is pretty helpful for a lot of folks So there's always help to be had. You just got to, you got to help, you got to ask for it.

Uh, there was a really beautiful, uh, article I was reading last night. Um, or the night before that was talking about like tutoring and why they're, why they're like less geniuses now and how effective tutoring can be for someone learning. And it just reminded me of discord and seeing so many folks giving up time and energy to help others learn and walking through stuff that gets stuck on and so Please make sure you ask for help jump into those voice channels. Don't be afraid to ask for the help that you need All right folks come on back come on back let's go through this Got the last one, dope, hey. All right, let's go through these together. And then we will probably take our break. All righty, declare a variable, reassign it to your favorite food, alert the value. So let's go ahead and say let fave food equal dominoes, but I can't let this stay dominoes, we have to reassign it so I don't get in trouble. We're gonna say fave food is dominoes, then we have to reassign it to your favorite food. All right, so fave food equals pho, or we'll say vegan pho, there we go, vegan pho. Oh man, there's this vegan ramen spot near me. It's a problem. It's a problem. All right, declare a variable, reassign it to your favorite food, alert the value. So we're gonna hit alert favorite food.

Beautiful. Declare a variable, assign it a string, alert the second, right? Declare a variable, assign it a string, alert the second character in the string. Uh-oh, uh-oh, uh-oh. Declare a variable, assign it a string, alert the second character. All right, so let's go ahead and do like the normal, the normal string that everyone starts off with. Hello, Twitch. Beautiful. Hello, Twitch. And let's alert the second character in the string. How can we alert the second character? There's a lot of things that we could do here. All right, I see some folks just saying use square brackets. Let's try that real quick. Let's try that real quick.

So let's just go ahead and say alert, and we're gonna alert extra. And how would I get the second, not the first? Yeah, we put in one. Let's see if this works. If we see E, we know it worked. So let's see if this works. Let's open in the browser. All right, we got vegan pho, and then we got E. So we know it worked. We see the E that was alerted. I know it's tiny, but the E alerted, so we know that it works. And if we look, we can see that string or strings in JavaScript also kind of work like what? They also kind of work like what? Arrays, yeah, we can kind of use some similar syntax. One of the odd things about JavaScript, we'll eventually see why this is next week.

Next week, we'll see why these bracket notations make sense. We'll see why it works this way, but just know that like, everything might be something that it's not. Let's just put that out there. Everything might be something that you don't know yet. And eventually they can all kind of wind their way together, so we'll get there. There's also something else we could have done. We could have done maybe a method. So I'm gonna comment this line out. This was kind of like one you could have researched. If you used your Google Foo or you went to the MDN, you might've found a different way of doing it. What's some other ways that we might've done it? Extra, what was something else? Yeah, charAt. So charAt is a method that's built into JavaScript or specifically with strings that enables us to get characters. And so if I say char at one, I get the same thing.

And what we're gonna notice is that we're starting, we say one because we start counting at zero. The H would be zero and the E is one. So it doesn't matter if we're using the square bracket notation or methods that we found in our research, we're gonna stick with that one. So arrays start to play out, or the understanding of zero indexing plays out a lot in JavaScript, even when we're not dealing strictly with arrays. Functions. Create a function that takes in three numbers, divide the first two numbers and multiply the last, alert the product and call the function. So let's go ahead and create the function. We're gonna call this divide and multi. and we're gonna take in three numbers. So we're just gonna say N1, N2, N3 as our parameters. We could call them whatever we want. We could call them robot, unicorn, chicken, it just doesn't matter. But we're just gonna do N1, N2, N3. Divide the first numbers, multiply the last, and alert the product. So let's go ahead and say let prod equal.

I'm gonna use parentheses just so that my, I know the order of operations here would probably be fine. It's just cleaner for me to read. So I'm gonna do N1 divided by N2, and then I'm gonna multiply the last. So N3, and that would give us the product, and then we're gonna alert that. So alert prod, beautiful. We could have done it all in one line, right? We could have taken this and put it inside the alert. That would have worked too, same thing. Yeah. Why assign them and not alert straight away? Just readability, readability. Eventually our functions might do more returning than they do alerting, right? So eventually this might be a function that we call over and over again. And so instead of alerting it, we might be returning that product and that'll make it a little bit easier to read. Yeah.

Okay, and then call it. Divide and multi, and we can pass in some numbers here. Let's do 12, three, and four. There we go. I'm gonna go ahead and comment these other ones out just so we can see if things are working or not. So I'm gonna comment both of these lines out, and then we should see, what should we expect, chat? What should we see if this works? What should we see alerted if this works? All right, we should see 16, right? Cause 12 divided by three is four, four times four would be 16. So let's see if this works. I'm going to come back here. I'm going to refresh and boom, 16. Love it. This of course is the cast of the first bachelors in paradise.

Just in case you were wondering who these wonderful people are Leon's head you said no math Well, I'm not doing the math the the computers doing the math Why are they so small? Because it's very hard to find photos of a lot of the bachelor offshoots some of the I'm glad you asked this This is a very important conversation I said, why are the images so small? So a lot of the earlier bachelor. Like spinoffs or the like side shows, they weren't really that like popularized and it wasn't like a big thing on the internet yet. So it's actually relatively kind of hard to find good photos of the entire cast or even individual photos of the cast without having to sit there and splice the actual show, even some of the shows and the special episodes are hard to find online. And so hopefully one day we get the full catalog, but yes. So some of the images are small because they're just really hard to find. So did I spend a lot of time trying to find these photos? Yes. Um, did I spend too much time trying to find these photos? Yes, but I think it's worth it. Well, create a function that takes in one number console log, the cube root of that number and call the function, function cube, cube it, or I should say cube root it. There we go, cube root it. I've taken a number, I'm gonna call that robot, and then console log the cube root of that number. Let's go ahead and console.log, and how did you all get the cube root?

Yeah, we're gonna use that math object that we talked about. Remember we talked last class about that. There's like this built-in math object that comes with all these goodies. And one of them is the CBRT, which is just the cube root. So we can take the cube root of robot. Beautiful. We could have also done math.pal. That I see some folks throwing out something there. You could have also coded this out. And so the cool thing about the cube root And one of the things I like about the MDN is, also I'm putting a lot of spaces in here just to make it a little bit easier to read. I wouldn't normally have these spaces, I just kind of make things a little bit easier to see for folks that are new to using these methods. Yeah. So if we were to console log, oh sorry, we already console log, we just gotta call it. So kuberoot it, let's pass in like nine, there we go. Let's save this, let's go to the browser, let's refresh, and let's open the inspector.

And in the console, we can see the cube root of nine. That's weird. Now, that's cube, not cube root. Where's a lot of decimal places here? There's a lot of decimal places here, how could I? How could I? Maybe not have all the decimal places. I don't want to round it, I just want like I just want like maybe to like the 4th decimal place. Yeah, square root of exactly square root of 9 is 3. This is a cube roots different. If I picked a better number than nine Yeah, we have this idea of to fix. Let me show you I can do this here to fixed to Fixed and then I can pass in a number. Let's pass in four. I'm gonna save this Let's change our number let's keep nine. Let's keep nine I'm gonna do to fix four and Let me refresh again And now you can see, we just have to the fourth decimal place, right?

We have until the fourth. And so instead of having the longer chain, we had the ability to, so there's a lot of really cool stuff that's just built into JavaScript, right? This math object that has cool stuff like cube root, uh, this method to fix, which will help us remove, reduce the, um, number of decimal places. And so when I talked about this idea of researching, right, starting to Google some things that are going to be some things that we just haven't covered, but are easily Google able, right? And so getting used to using the MDN, using the MDN to find cube roots, using the MDN to find these little things, they're going to keep coming up in the challenges is what I want you to get comfortable with. Because on the job, that's what you do. When when when you have to do the cube root of something, you're not going to you're not probably going to sit there and bang out the cube root code, you're probably just going to figure out like, oh, does JavaScript have a way of doing kuberoots and then use that one of the things I really do love about the MDN though is MDN kuberoot kuberoot cool if we look at the MDN this new layout it keeps bothering I think it looks good I'm just not used to it I don't like change the cool thing I like about the kuberoot is it actually shows you like the code behind it. Right? I actually like the code, it shows you the code behind it. I should probably put it on dark mode, sorry. There we go. It actually shows you the code behind it. And so if you wanted to not use the built-in code, you could like actually see how they would write it out, which is pretty dope. So I really do like the MDN when they show the actual stuff behind it. And I'm just really glad that I don't have to know how to do this.

I can just use the cube root. Yeah, that's it. Sorry for the flash bang. Yeah, we'll use dark mode on there. It's pretty though. Yeah. A polyfill means that maybe sometimes there might be a browser that doesn't give you access to this cube root. And how would you like write code to get around it? And so it shows you the code that you could use. So it's just kind of like what could you use to fill it in? Like what code could you use to get around not having that object built in? Yeah. Is it better to put console log and alert in the function than like that rather than using return and doing console log later? It's not really, it's just a demonstration. I don't really use these like console logs or alerts that much in my actual coding.

It's just so that we can visually see what's happening. I would probably be using return mainly in a lot of my actual code. So you don't have to get kind of worried about like using console logs or alerts. It's just so that we can see what's actually happening a little bit easier, yeah. Conditionals, create a function that takes in a month. And if it's a summer month, alert, yay. If another month, alert, boo. So what are we gonna use? What are we gonna use here? What are the big four we're gonna use here? Function check for summer. Yeah, we can just use some sort of conditional. We know we're gonna take in a month, so let's call our parameter month. Let's have an if, and we're probably gonna have an else. Cool, so we can say if month equals, What's the first, what's the first June, right?

If month equals June, what's wrong here? What are some things I wanna get into trouble with here? Yeah, warning, warning, Will Robinson, exactly. This is assignment, this is not comparison. I'd be reassigning month to June no matter what, it'll be true. So that's our comparison. We could also say, or, or month equal July. I'm really struggling with these months. July or month equal August, August. There you go, August, beautiful. And then there's some other things we might run into, right? We might run into something else. Would I consider a switch case? Yeah, I could, but we haven't really covered those together yet. Yeah, what if somebody does it capitalized?

We gotta make sure that month is lowercase. So let's go ahead and say, I actually wanna create like a different variable for it just to make it a little bit more readable. Let's say let month lower case equals month dot two lower case. Beautiful. And instead of this being month, this will be month, lower case, month, lower case, month, lower case. Beautiful. Could you make an array of summer months and winter months? You could, yeah, that could be something you could do. And then there are some methods that are built into arrays like includes, where you could just see if it, Like you could just take the month and see if it's included in your array. We'll get there folks. We'll get there. We're not there yet, but we'll get there. And that's something you'll see a lot in your coding challenges. Yeah. There's methods built in with arrays that would enable us to like not have to do the conditional logic.

Smart. Don't break my brain. Yeah, we're not there. You're not gonna get there yet. So this is supposed to be an alert of yay. And this should be an alert of boo. I might be at the point where I would maybe also to have an else if for all the other months, right? If I was gonna, if I was to really do this, I would have my if for my summer months, I would have an else if for all the other months, because it says if another month, alert, boo. And then I would have an else that says like, not a month. Right, so I'd have an if for the summer months, an else if for all the other months, and then an else that would, like an else saying like not a month. So slight semantics here, if we had a little bit more time, that's what I would do. Yeah, yeah, we only gave us four minutes to do this. Yeah, exactly. So a little bit more time, that's what I would do. Loops, create a function that takes in a number, console log every number from one to that number while skipping multiples of five.

All right, so we want to print from one to a number, but if it's the number, if it's a multiple of five, we don't print that number. We just skip over it. We'll do this and then we'll take our break. Cool. So, let's create our function here. We're gonna call this skip five, or skip fives, beautiful. We're gonna take in some sort of number, just gonna call it n, and we know that we're gonna, if we're gonna go from one to some number, what do we need? We're gonna go from one to some number, what do we need? A loop, exactly. So let's go ahead and just do a for loop for now. We've seen that syntax the most. Let i equal, and since we're starting at one, we'll set it at one. While i is less than or equal to n, right? One to that number. So while less than or equal to that number, and then i plus plus.

And then what we wanna do is we wanna check. Is the number divisible by five? Well, is the number not divisible by five? Well, we can say, is the number divisible by five? Right? No. Let's say not divisible by five. We can say i mod five does not, is this, what is it? Hold on. Console log every number one to that number while skipping multiples of five. So as long as it doesn't equal one, as long as i mod five does not equal zero, right? Then we console log that number. Beautiful, there we go. Right, so what we're saying here is, hey, take whatever the number is, divide it by five. As long as it is not zero, then print that number to the console because let's say this works.

So one mod five would work, two mod five, three mod five, four mod five, five mod five would give us zero. So since zero is not equal to zero, we wouldn't, this wouldn't be true. We wouldn't print it to the console. So the idea here is that this will always be true and we'll always print the numbers to the console unless the number we're currently at is divisible by five. Yeah. And this is using the not. There's maybe some slightly other ways to do it too. They're like, this like not logic is something that some programmers try to stay away from, but I like to think about it this way for now. We'll see some other stuff when we get to our coding challenges later on. I misread it. I thought we were going from one to that number by counting by five. That's what my brain went to immediately as well. I thought I had to jump by five. That's why I had to reread it. Beautiful.

All right, so we'll go from one to the number. As long as that number is not divisible by five, which would make it a multiple of five, we print the number to the console. If it's false, we just don't do anything. We just move on to the next number. All right. Let's go ahead and save this and let's go ahead and take our break. When we come back, we're at the top of the hour. So that's the top of the hour. We always like to make sure we stay healthy. If you're new around here, we get up we if you're able to we move around we hydrate We let our eyes focus on something. That's not the screen and we come back a raise baby. We're going back through it We're gonna have some more fun different examples more practice more hands on keyboard. Let's make a raise make sense five minutes on the clock Beautiful All right, see y'all in five You Yo, thank you for the hype train. What Linux is sure to use? I use a bunch of them, mainly a Debian user.

Sombor shuffle. Yes, please. I haven't yet mango. All right, folks, come on back. Come on back. Let's get into some rays. What about Daddy Yankee? There it is. Doritos in chat. Hey, I see you. All righty, come on back. Leon how do we decide what rates to charge? You don't. You figure out what their budget is and then you ask yourself, what can I get done at that price point? That's it.

I love a raise. Me too, blah. I think arrays are like, I try to explain this when I talk to like other folks about Learning the code Arrays are like one of the first really big stumbling blocks for a lot of folks It's like the first time that things kind of get I think Reasonably overwhelming right? It's just something I see across all my students. So there's a reason why we did on Tuesday We pushed you to the point where it was hurting a little bit and there's a reason why we're going all over it again today with different examples, right? So the arrays, I understand, like I know it. Like I know that for some folks, arrays take a few classes to click. And then for some folks, it's the objects that take a few classes to click. That's okay. We're gonna review it right now. And we're gonna review it on Sunday. So even if today's not enough, that's all right. Come back on Sunday, we're gonna do it again. We're gonna do a normal kind of office hours where I answer questions, but we're gonna do a lot of practice with arrays too. And Sparks, never too late, never too late.

And then the cool thing is, once you find something that's difficult, yeah, somebody was saying, Diablo said this, right? Once you find something that is difficult, the cool thing about being in the flow with Code Wars is that you can search for specific problems. Don't do it yet. Do level eight fundamentals track, but eventually you could just do array problems. And so we'll eventually have weeks where we just do arrays. We'll have weeks where we just do loops. We'll have weeks where we just do objects, right? And so the, that idea of using CodeWars not only as like an interview prep tool, but as a learning mechanism is huge. A lot of folks say, hey, like, how do I, where can I practice my code? Well, that's what CodeWars is for. Do level eights and search for array problems. Do level eights and search for the specific thing that you have trouble with. Now, and if you're on CodeWars, the clan is, and it's case sensitive. Octothorpe100devs-leondewell.com slash Twitch. That is the full clan name.

It's funny saying like all these other small ones because people didn't type it right or plugged in the wrong thing. But if you want to be in the official 100 devs clan, it's the Octothorpe100devs-leondewell.com slash Twitch. You can do exclamation point clan here in chat. Eventually we'll have some cool prizes and some ways to get some, some cloudy stuff here in chat. So last cohort, we did the person with the most growth from one month to the next, they got VIP. So we're going to do some fun things like that. We'll pick some random folks that are participating in the clan. We'll pick some folks that did the most. We'll do folks that are the highest ranked and we'll give out not only like special colors on discord, but VIP here on Twitch. So if you want to make sure you're in the official clan because there's there's perks folks. There's perks Alrighty a raise what the heck are a raise What the heck are a raise I love perks me too Warmth they're toasters Exactly. I'm glad we all get that next. Yeah, so I like to think of a raise like I think of toasters one thing That can hold multiple other things and we talked about my what I thought was a good toaster We talked about 50 cents toaster and we talked about Bill Gates toaster, right and Bill Gates toaster Whenever you fill up all the slots a new slot automatically appears And so that's kind of what our arrays are. They are one element that is a collection of other things. And so if we kind of break that down a little bit further, an array is technically a data structure.

It's a way of storing an ordered collection. When I say ordered collection, what do I mean? What do I mean by ordered collection? Yeah, it comes with indexes. is it starts at zero. That's the beautiful thing. Each slot of our toaster has elements in it, but those elements, those slots, we start counting those slots at zero, right? And the beautiful thing about arrays is there are a lot of methods that are built into JavaScript. A lot of functions that come with JavaScript that make working with arrays really fun, enables us to do some really powerful stuff. We saw how powerful 4-H could be, but there are so many other methods that we're gonna start seeing today. Map, eventually in a couple weeks, we'll see reduce and filter includes, all these wonderful things that come with arrays that make our lives a lot easier, but we'll get there in good time. There are two ways to create arrays. There are the constructor way, which we'll get to next week with objects. And then there is the literal notation, right? Yeah, the clan, the clan link is not a link.

That's the actual thing you throw into your clan on Code War, so it's not a link to it. It's the thing you plug in, yeah. So there's the object way, and there is the literal notation way. And so literal notation is just using the square brackets, right, the square brackets, beautiful. When you declare an array, you can populate it with elements. So here I have three elements in the array as I assign it a value. And what you'll notice is that arrays can hold any of the other data types we've talked about so far. They can hold strings, booleans, numbers, heck, they can even hold other arrays. Bill Gates toaster, guess what? He got a second toaster and put a toaster in his toaster. You Sometimes you just you just not doing life right, you know, they got a toaster in the toaster One day one day So we got a zebra, we got a Boolean, we got a number, and if we're at Bill Gates' house, we got a toaster inside of our toaster. Now the tricky part, the tricky part, is that we start counting the slots on our toaster at zero. Our arrays are zero indexed. So if I want the first element out of the array array, what is its index? The first element, what's its index?

Beautiful. What is at, what city is at the second index? It was zero, that was correct. Yes, Sydney is at the second index. Zero, one, two, Sydney is at the second index. What is at the fourth index? Undefined, exactly. There's no fourth index that's undefined. It doesn't exist. Beautiful. Alrighty. Now this is where I think a lot of folks kind of got tripped up. Not only can we put stuff into arrays, we can get stuff out of an array. And when you see this notation here, this is grabbing the value out of the array. So we're using the array name and the square brackets along with its index.

When you do that, you are pulling the value out of the array. So here I have gone ahead and pulled out Zebra. Since Zebra is new array at index zero, this is the index zero. So I have pulled out zebra and since this is inside of a console log, we would see zebra print it to the console Right, just like if we had a toaster Here's our toaster This is a three-slot toaster, I don't know why there would be a three-slot toaster, but there could be and Here's our zeroth index, our first index, and our second index. And inside, inside of the first slot, we got a pizza bagel. Inside the, sorry, the zeroth index, we got a pizza bagel. In the first index, we got a piece of bread. and in the second index, we got a toaster strudel. Right? You can tell the difference between a piece of bread and toaster strudel, right? There we go. So, if... I didn't know Leon was an attack on Titan animator. So here, if I want it, and I'm gonna call this toasty. This toaster is called toasty.

So if I want it toasty, square brackets, two, what this is going to give me is it's going to grab the toaster strudel for me. This is the same thing as grabbing that toaster strudel. I'm saying go to the zero, one, two, the second index, and grab that toaster strudel. This is the same thing as grabbing that toaster strudel Right if I want toasty Where brackets zero that's the same thing in as coming in and Grabbing that pizza bagel. I might as well just Derase this and put in pizza bagel Right and then if I want toasty where brackets one that's the same thing is going in and grabbing this boring piece of bread and It's I can just get rid of this and it would just be a piece of bread Beautiful Now Here I'm doing the same thing I'm I'm grabbing the zeroth index out of this array, which is the same thing as plopping in zebra. And that's why I would seek log to the console zebra. Then here I'm going and grabbing the thing in the first index. But is there anything in that first index chat? Is there anything in that first index? No. So we get undefined printed to the console. Remember, we're still inside of a console log. We get undefined printed to the console. Then we try and grab the thing out of, we try to grab the thing out of the second index, which is a Boolean of true. So it's as though true was right here, right?

And then the last one, we're grabbing the thing out of the third index, and that's going and grabbing 21, 21, 21, 21, 21. And so that's as though this got crossed out and there was just 21, and we would see 21 printed to the console. So when you see this notation, it enables you to pull stuff out of the array. Now, where a lot of people get tripped up, they maybe realize, oh, that's just pulling something out of the array. It's just like using a variable, right? We can pull stuff out of the array. Where folks get tripped up is that we can also put stuff into the array using that notation. It's the same thing as reassigning a variable. So what we're saying is, hey, find that array, go to this index, and put this inside of it. Put that inside the first index. So let's actually type this out, because I think this tripped up some folks last class. I want to spend a little time on it. All right, so let's go and create an array. Let's call this, let's call this, let cool cars equal. And then we're gonna set up some cars.

Oh, I kept hitting the wrong key over and over again. Alrighty, we got our square brackets and let's do some cool cars. What are some cool cars? Lightning McQueen. Yeah, there we go. All right, we got a 1998 Honda Accord. Beautiful. What's another cool car here? Ooh, 2017 Toyota Yaris. Definitely a cool car. And a race car bed. That's awesome. Race car bed, beautiful. So now if we ask for cool cars, we can see we get this array back of 1998 Honda Accord, a 2017 Toyota Yaris, and a race car bed. If I wanted to actually replace the thing that's not a car, right?

The race car bed's a cool car, but it's not a real car. So what I wanna do is I wanna reassign race car bed to be a cool car. So I'm gonna do cool cars, and I'm gonna use what index? What index would enable me to reassign race car bed? Yeah, I'm going to use that second index and we are going to change it equal to 2015 Nissan GTR Midnight Black Edition. Psyche 2015 2015 Hyundai I'm gonna spell Hyundai that's embarrassing 2015 Kia Altima there There we go. Beautiful. Hit enter. And now when we ask for cool cars back, you can see that we get 1998 Honda Accord. We get a 2017 Toyota Yaris, and we get a 2015 Kia Altima. Oh, the engagement's too easy. The engagement's too easy. This is a good one. But here, the point is, is not only can we use to get stuff out of the, to get stuff out of the array, we can use it to put stuff into the array. Right, we can put stuff into the array.

And so here, I just used that notation and I set it equal to 2015 Kia Altima. And you can see, it changed from race car bed the 2015 Kia Altima. Beautiful. Alrighty. Let's keep pushing here. We also saw something really interesting, right? We saw something interesting, and that was that when we have an array, we could actually overwrite a whole array by reassigning one array to another. And so here I have an array of cars, Honda, Toyota, Ford, Tesla. And then here I have an array of numbers, one, two, and three. If I set cars equal to nums, well now cars is holding that one, two, three array. And when I console.cars, I get one, two, three, right? You can overwrite whole arrays by assigning an array to a different array. So the idea here is that you can not only reassign individual values, but you can reassign the whole array if you want to. What are their different lengths? It just doesn't matter.

It overrides the whole thing. Yeah. Speaking of length, if you ever want to know how many elements you have in your array, you can do .length. And when you do .length, it gives you the total value, Sorry, the total number of elements in that array. So this is really helpful to figure out how many things are in your array and get that value out. Alrighty, let's go ahead and get some practice and we've reviewed the basics. Let's get our fingers on the keyboard here a little bit. I want you to open up inParadise afterParadise. So we have this afterParadise is of course like the after show behind it. So we have this lovely review in paradise after paradise. I'm going to open up this HTML and this JavaScript. And if we look, it's just one thing. Create a function that takes in an array. If the first number is less than the last number alert high. If the first number is greater than the last number alert by if they're equal alert, we close in an hour.

So this is gonna require you to be able to pull stuff out of the array using its index to do a comparison in your conditional so let's go ahead and Put let's do four minutes on this one four minutes on this one And then we'll go over it together. I Agree with blah you all can do this dig deep think it through Think about how you can grab stuff out. Think about how you set up your conditional. Look at the previous slides. Look at our conditional slides if you need to. Five minutes, four minutes on the clock. I've had it. We'll go over it together. Uzi said Blah has too much faith in me. No, they have just the right amount of faith in you Got some dunzo's that's okay On add one is back a are you doing I do crispy nugget but that one required me to put like different stuff like different licenses on the YouTube videos I just didn't feel like it just I just never remembered to do it and just got rid of it because of that stream beats is much easier. You don't have to put a license on the video. Minutes left. Yeah, I do. I like Indian food a lot. Tiger, give us a little bit more time to go through the, the forms.

Leon, why do we start earlier than before? Because in the U S we have daylight savings time, which means that our clocks change twice a year. And so the time may be different because we have daylight savings time in the U S. Oh, that's right, yeah, Arizona does it differently, right? Done for the first time, hey, congrats, June. Don't worry if this one got you, we're gonna go over it together. uh we used to we took in a cat for a while that was named birani it's funny that's your Favorite favorite. Yeah, we had a cat named that for a while All right folks 30 seconds left Will the cat dog can make return yeah, it will eventually I I've been not yet. Although some folks have been organizing their own in the location channels, Malaysian dish too. That's cool. I didn't know that. All right, folks, come on back. Come on back. Is a switch better than if else? No, I mean, they just have times that you might use one over another or a preference when I say it's better or worse, unless you're talking about like, like really nitpicking, like time complexity and stuff like that.

But even then that's what I think I would really worry about. All right, folks, come on back. Let's go through this together. Alrighty, create a function that takes in an array. If the first number is less than the last number alert high, if the first number is greater than the last number alert by, if they're equal alert, we close in an hour. So before we get into the function or the conditional, there's two key things we need to know how to do. We need to be able to get the first value out and we need to be able to get the last value out of the array. So let's pretend we had an array that was 10, 20, 30, 40, and 50. And we're gonna call this array, let nums equal. There we go, so we have an array of nums equal. How could I get the first value out of this array? Step one, plug in your toaster. Yeah, I could do nums zero. That would give me the first value, and so that would be 10. And if I wanted to get the last value out of the array, what could I do?

Last value out of the array. I could do this, right? I could do zero, one, two, three, four. And I could use the fourth index and that would give me 50, right? But that wouldn't work if I kept adding new numbers. Like if I added like another number here, like 60, this would be, that four would be hard coded and it wouldn't give me the last number. It would always give me the 50. I need some way of grabbing the last number no matter how long it is. And so the thing we learned last class was nums.length minus one. So if we actually break this down, nums.length in this case would give us One, two, three, four, five, six elements. Remember nums.length would give us six because there's six elements in the array. So that's the same as plugging in six there. And then I have to subtract by one y. I have to subtract by one y. Is there a sixth index here?

Yeah, it starts counting at zero. So zero, one, two, three, four, five. If I actually went to the sixth index, it's over here, right? It's over on this side. There's nothing there at the sixth index. So I always have to subtract by one, and that would give me five, and that would wind up pulling out 60. All right, so we have to do the length minus one, right? length minus one so that we can get the last element in the array. Remember, length gives you the total number of elements, but we use the index to pull stuff out of the array. You have to find the correct index. So now with that knowledge, let's go ahead and create this function. Function check first and last. And we know we're gonna take in an array. I'm just gonna call it R, but we call it whatever we want. We could call it duck, unicorn, it doesn't matter.

But it's an array, so I'm gonna call it R for array. And we need to check if the first is less than the last. We're just gonna do a nice conditional here. A nice conditional here. And let's go ahead and grab the first number. That first number is always going to be square brackets here. That one's easy. We can always grab the first one. A lot of folks are saying, what about like the meth? It's like pop and stuff like that. We're going to get there later today. Later today, we'll see pop and we'll be able to use that going forward if we want it. All right. But that would also, we get into like array mutation, but we'll, we'll talk about that later. All right.

Array zero would give us the first and we want to check to see if it's less than the last. So we'll do array equals array dot length minus one. Beautiful. So what we're gonna say is if the first number in the array is less than the last number in the array, what do we do? We alert high. Cool. And then we're gonna have an else if, and we're gonna say in the else if, in the else if we're gonna say if the first number is greater than the last number. So we can kind of just repeat this again, grabbing that first number with the zero index greater than the last Same same trick again array dot length minus one But we just switch the the the arrow here to be greater than and if that was true, we will alert Bye And then if it was not less than or greater than the only leftover result would be what chat If it wasn't less than or greater than the only leftover result would be what? Yeah, the only thing that'd be left would be for it to be equal. So we can just do an else. We don't have to check anything. We know that it would have to be equal. And so we can just alert, we close in an hour. Beautiful. How are we feeling about that one?

Pretty close. You got pretty close. That's good. Pretty good. Hot. All right. Cool. Alrighty. Let's keep pushing folks. Nailed it. Like to hear it. Still a little struggle. That's all right. All right, we'll keep pushing. All righty, the thing where we kind of got a little fast and loose last class is when we started to try and iterate through our array.

So we tried to like move through the array. And so this is where I can kind of get a little wild, especially when we introduce things like for each. And so a lot of times when we have arrays, we're gonna want to be able to pull stuff out of the array one after another. Right, to pull one out after another. And so the wonderful, you got ads? How did you get ads? We ran three minutes less than an hour ago. That really annoys me. I'm sorry y'all get ads sometimes. I I wish there was a way for me to To turn them off entirely. I would pay twitch money I wish I could pay twitch money to not run ads like whatever they're making out the ads like I like I know It can't be that much He's a host Cool I'm just giving folks a second because the ads really get my goat All righty. Yeah, I mean, we run ads so folks don't get the midstream and no pre-rolls, but it still happens, it's weird. All righty. We wanna be able to move through our array. So I wanna be able to grab each element out of the array.

And so here is a loop that's gonna enable me to do that. And so here I have a normal for loop that we've been setting up. We have our counter called i. We're gonna run until we, we're gonna run once for each element in the array. And the reason I know I'm gonna run once for each element in the array is because I'm going up to the length of the array. This is the same thing as if I had said four, because there are four elements in this array. So this loop will run four times because we're starting off at zero. If we started off at one, how many times would this loop run? Like if we started this off at one, how many times would this loop run? Yeah, it would run three times and not four. But since we're starting at zero and we're going up into the length, that'll run four times for us. Beautiful. All right, now the very first time this loop runs, what is I? The very first time this loop runs, what is I? I is zero, exactly.

I is zero. So if we ask for best colors zero, that gives us green. So it's as though we plugged in green into this console log, and we print out green to the console. Then the counter goes up by one. And now when this runs, we're doing best colors one. And that's the same thing as going to the first index and grabbing blue. So it's as though we put blue in here and we wind up console logging blue. The next time this runs, I has gone up by one and we're at two. So we're going to find best colors, zero, one, two. We're going to grab yellow. And if those we plugged in yellow right here. And so we wind up console logging yellow. Then the count goes up by one. And so we're plugging in, we're plugging in three. And so it's as though we did zero, one, two, and three.

and three grabs black. We plug black in and it says dough. We had plugged in the string of black and that gets logged to the console. Then we add one to I and we're at four. Is four less than four? No, it's not less than four. And so since it's not less than four, we stop. And we're done printing things to the console. Beautiful. Cool. What would you use array iterations for? Let's say I wanted to see everyone that showed up today. All right, let's say a month from now, you say, hey, Leon, can you take a look at my code? I wanna see if you were in class, so I could check the attendance by looking at the tweet. And that tweet has all the folks that liked the tweet.

So I can throw all the folks that liked the tweet into an array, and then I could loop through that array and see who was there, right? I can maybe print all the names into a list for me to easily see who was here or not. Exclamation point check-in. So the idea is that arrays are really helpful for keeping track of a lot of stuff. We could use them for attendance, we could use them to add in certain things as we come across them, which is a way of keeping track of a lot of elements at one time. All righty, we also have this other method, right? This other method that came up with arrays called foreach. And what foreach does is it's the exact same thing as a for loop, right? It's the exact same thing as a for loop. It just does a few things every single time it runs. So the beauty of four each, oh, Blah got a good hydrate. Hold on, Blah, Blah, when Blah does the hydration, all right, we're gonna, it's the water, we're gonna finish it. You There we go, cheers to you below thank you for the hydration That's some OnlyFans stuff right there. Hey, only a million channel points. That's all I got to say.

Alrighty. So for each, right, for each is the same thing as our for loop, right? as our for loop, same thing. For each is gonna run once for each element in our array. So how many times will for each run on the best colors array? How many times will for each run on the best colors array? Four times, because there's four elements in the array. The length of the best color arrays is four, So 4-H is gonna run each time. Now, here's the really important question. Each time 4-H runs, what does the 4-H goblin grab? Every single time 4-H runs, we know it's gonna run four times, but what does the 4-H goblin grab every single time it runs? Yes, the foreach goblin's gonna grab the element, the index, and it's gonna take note what array it just stole stuff from. So it's gonna grab the element, the index, and it's gonna take a note, oh, I stole that from the best colors array. And so the cool thing is each time foreach runs, this goblin can go and grab that stuff. And the goblin is going to pass that stuff into this function here.

Every single time for each runs, the goblin runs and grabs the element. The goblin runs and grabs the index. And it writes down, oh, I got it from the best colors array. And so every single time that goblin runs, it's gonna pass in the element, it's gonna pass in the index, and it's gonna even pass in the array that it came from. So right now, what bucket, what's the bucket the goblin is using to hold the element? Right now, looking at this code, what is the bucket that the goblin is throwing the element into? Yeah, the goblin is throwing the element into the bucket of X. And what's the bucket that the goblin is using to throw the index into? Yeah, it's gonna throw it into I. So here we have this idea that we're throwing. the goblin is throwing the element into the bucket of X, and the goblin is throwing the index into the bucket of I, and then it's also, the goblin is also trying to throw the array into this function, but is there a bucket for it? No. So the goblin is like throwing up the shot, but it's just an air ball every time. So the first shot, the element falls into X. The second shot, the index falls into I.

But then it tries to throw the array into the function and each time, each time it just poofs, it disappears. Right, there's no bucket for it. Cool. So if we were to let this run, the very first time this for each runs, the goblin's gonna grab green and zero. So it's gonna throw green into X and zero into I, and we're gonna see printed to the console, what? What's gonna get printed to the console the very first time? Green, green. Does anything happen with the index? No. Nothing happens with the index because we're not using it inside the function. We're only using the element. All right. The next time 4-H runs, the code goblin grabs blue and one. It passes blue into X and one into I. We see that we're gonna print blue to the console.

So we see blue get printed to the console the next time the code goblin goes and grabs yellow and two so we pass in yellow into X and Two into I and we wind up printing yellow to the console then the last time the goblin runs it runs around and it grabs black and and three. So it passes black into X, and it passes three into I, and we wind up printing to the console black. Then we're done. The goblin is tired. It's done a bunch of running. There's no more elements in the array, so the for each stops, and the goblin is out of business. Cool. Important mango said, Leon, can we take a break so I can eat my Chinese food? Absolutely. Let's take a break. So important mango can eat their Chinese food. When we come back, we're going to practice using our loops with arrays. So let's put five minutes on the clock. If you're new around here, we'd like to be healthy. Please, if you're able to get up, move around, hydrate, take care of yourself.

Folks is a marathon not a sprint and we'll be back in five minutes Walk your goldfishes if you have to Beautiful alright, see you in five folks gonna run some ads Here. I like mango better. Yeah, it's a good one Collective nectar it's actually the full thing like it's the and it's capitalized it's the hyphen it's the link to twitch it's the whole thing smurfs versus glop goblins who's winning I don't know I think like how many smurfs are there it's probably way more goblins than smurfs right and goblins like way bigger. Maybe that's part of the Smurfs power is that you can't find them. Exactly. What's a goon to a goblin though? Nothing, nothing. All right, folks, come on back. Let's do this together We got some work to do we have the summer game. So let's go ahead and take a look at that together I'm gonna go ahead and close this one and this one and we're gonna open up summer games One of my Say it's one of my favorites, but it was a really good run summer games winter games I wish they could bring them back a little bit more a challenge s for folks that are kind of more real-world II fans Yeah, all right. Create a function that takes an array of numbers, multiply each number together, and alert the product. Create a function that takes an array of numbers, multiply each number together, and alert the product. So we're gonna need to somehow iterate through the array, grabbing each number and multiplying them together. Let's put a solid five dub on this one and let folks see if they can get it going. This was a Code Wars question?

Yeah, I believe this is, yeah, this is probably definitely a Code Wars question. So go ahead, take five minutes. See if you can get this working. Take your time, create the function. If you don't know how to do all the pieces, try different pieces. Try creating the function. Try creating a function that takes in an array. try looping through that array, look at the past slides, look at the for each, look at the for loop in the slides to see if you can piece together how to do it. And then we'll go over it together. Got this folks There is a problem with the review in paradise one, let's see That looks good. We can test it though. I think that looks good though. Uh, Luan, the uh, hi Luan, the link is in the slides at the beginning of the slides for today. Look at all these dunzos, that's wild. Bye next week biohazards The review in paradise let's let's run it let's make sure that it works This one here.

While folks are working, I'll test it, see if it's doing its thing. Yeah, it worked, 1, 2, 3, 4, skip 5, skip 10 and skip 15, definitely worked. Oh yeah, we didn't run it so it was good to test it to make sure. We are on the review summer games project. How many points to be in secret chat? What secret chat? What is your favorite flavor chip? um sour cream and onion hers which i haven't had since being vegan you take the you take the the sour cream onion hers chips you crunch them all you You crumble the bag and get them all nice and tiny then just go to town 30 seconds folks Have a cut up on Snowpiercer. No, not yet. I'm kind of like, I like to, I like to just binge it. I'm going to wait until the, this, the show's done. And then I'm just going to watch them all give any advice for anyone struggling with burnout. Take your time. The marathon, not If you need to take a week off and come back, do it. We'll be here, catch up crew will be here.

Everyone has their own race to run, but we're all on the same rollercoaster. We'll all eventually get there. Excuse me. All right, let's come back and take a look at this together. So what we're gonna do for this one is create a function that takes in an array of numbers, multiply the numbers together and alert the product. So let's create our function. Let's call this multi nums in array. And we know we're taking in an array. And we know eventually we're gonna alert a product. So I'm gonna say let product equal one. Why don't I set product equal to zero? I'll be honest, I did that first. When I was creating this, I did it by zero first because it would just always be zero. We got to start with one or else we'd always wind up with zero. Yeah, that's how I started this one.

All right, now we're gonna loop through our array. We can do two different kinds of loops. We could do a for each loop or we could do a regular for loop. Since we saw for each most recently, let's do a for each together. So I'm gonna say array. and then we'll do foreach, right? So that's the actual foreach itself. And then we can put in an arrow function into this foreach that'll run once for each time that the foreach runs. And so I know that I'm gonna pull a number out of the array. And so I'm just gonna use that number. And what I'm going to do is I am going to times the product by that number. All right, I'm just gonna times the product by that number. So the idea is that the goblin is grabbing each number out of the array, right? Is grabbing each number out of the array and then timesing it by the product. Cool, let's see if this works.

And then we have to alert it, right? Let's see, and we're gonna call, let's call multi-num, and let's turn in an array that has one, two, and three. One, two, and three. Actually, let's do 10, two, and one. All right, let's do 10, two, and three. 10, two, and three. I don't like starting off with one because sometimes that confuses people. So we'll do 10, two, and three. So if this was the work, we would have 10 times two, which is 20 and 20 times three, 20 times three, which would give us 60. So let's see if this works. Let's save it. We have to open this in the browser. Beautiful, we got that alert of 60. So we know that it works. And so if we go back and look, wrong one, if we go back and look, let's talk through what's happening here.

So I like setting up my variables because I think it's easier to see. And so here I have my function that's taking in an array. So we know this whole array here is being passed in. Wherever I see R, it's actually the 10, two, three array. Cool. I set up my product at one Cause I know I'm going to be multiplying everything, right? And I see everything into that product, right? And then I have my for each. And so that for each right is using this array. So how many times is the for each goblin going to have to run around? How many times is the for each goblin going to have to run and grab stuff out of the array? Yeah, that goblins going to have to run and grab it three times. I talked about this today, too. In America, we do this this doesn't make sense. This is hard to do It hurts and then some people like do this that that that hurts even more we can just do that Why don't we do this?

That's three. It's so easy That's three. It's so weird that we don't do that in the States. It blows my mind The first time somebody showed that to me. I was like what? Alrighty We have the 10, two, and three is our array. And so we said the for each goblins gonna run three times, right? Gonna run three times. I didn't know it was a German thing. That's interesting. All right, 10, two, and three is our array. So the goblins gonna run three times. The very first time the goblin runs, It's gonna run and grab 10 and zero. The only bucket I have is numb. So the only thing that's actually going into this foreach is going to be the what?

The only thing that's gonna actually, the goblin's gonna actually be able to use inside this foreach is gonna be what? The element, exactly. it's not gonna be able to do anything with the index or the array, cause there's no bucket, right? There's no index, there's no bucket for the index, there's no bucket for the array. So the only thing we're grabbing, the only thing we're grabbing is that element. So the very first time this runs, wherever we see num, it's actually 10. So what this winds up being is product multiplied by 10. And so for folks that haven't seen this syntax before, it's the same thing as saying this, product equals product times num. So this is the same thing as saying one times 10 reassigns product. So product goes from one to now being 10. All right. So I like the other syntax. I think the syntax, the other syntax is a little bit easier to read for me. Asterisk equals num. So all we're doing is whatever product is, is we're gonna keep multiplying the numbers into product.

So the very next time the goblin runs, it grabs the two and wherever we see num, it's actually two. So we wind up doing 10 times two because product is currently 10 from the last multiplication and this time when num runs, it is two. All right, the very last time the goblin runs, it grabs three and wherever we see num it is three. So we wind up doing 20 times three and that means at the end of the day, product winds up being 60. And so we wind up alerting 60. You Human hey, thank you for the 10 months. I'm sorry three months And all that Bezos is money. I appreciate you where did numb come from I made it up We can call it whatever the heck we want it's just a bucket I can call this Call this Bing bong And then I would just have to call it bing bong over here. All right, all bing bong is is a bucket, all right? All it is is a bucket. So the 10 falls into that bucket, the two then falls into that bucket, and then the three falls into that bucket. Just a bucket, call whatever you want. This is the arrow syntax. It's a slightly way of doing different way of doing functions. It's an arrow function a special kind of function It's it's a way of doing kind of almost it's a way of doing an anonymous function in line Don't worry.

We'll eventually get to what all that means next week with objects and fun stuff All righty Let's go ahead and keep pushing here. Some folks want to see it without using for each. They want to see like the traditional for loop. So let me go ahead and do that. Let me just comment out this line. Let me just comment out this line and we will do it with the traditional for loop as well. So same deal for, and then I'm going to set up my calendar. Let I equal zero. Well, i is less than array.length. And we're just gonna add one to i each time it runs. And then we're gonna do the same thing inside of here. We're just gonna do product equals array and then whatever i is. All right, whatever array i is. And so if we run through this again, this might be a little bit clearer to see is that we know that we're passing in this array. Wherever we see array, it's actually the 10, two, three array.

So down here, what we're doing is we're saying array.length, which is three, right? So we know this loop will run three times. And what we're gonna do is the very first time that this runs, array zero is the 10. The next time this runs, I goes up by one, array one grabs the two. The last time this runs after it goes up by one, we're grabbing the array two, which gives us the three. And so it's the same thing. We just wind up multiplying the numbers in the product. Why do I have product equal one? I just like to know that I have my product defined, and that's the thing I'm multiplying into. I like seeing that it's set at one. There might be some shorter hand ways of doing it, but I like it to be visible and know that that's the product that I'm multiplying into. If it was zero, we'd wind up doing 10 times zero, which is zero, two times zero, which is zero, and three times zero, which is zero. So if we started with zero, the only thing that would ever get alerted is zero. Product is just the variable that we made up, yeah. Why in some places do things not need to be declared, aka array and num?

That's a really good question. So array and num are parameters, right? We can see here that array is a parameter. And so wherever I see array, it's not technically a variable. It is the parameter that we're using. So we don't need to declare it. It gets its value when we pass the argument into that bucket. So array is the parameter everywhere. And then if we, let me just kind of comment out the for loop again and look at the for each loop specifically. What we see here is that num is yet again a parameter. It is the parameter for this function that we see here. So we don't have to declare it. It's a parameter that we pass a value into. So in this case, we pass 10 into the parameter. We pass two into the parameter num and three into the parameter of num.

So they're parameters not variables. They don't have to be declared in that same way the question All righty, let's keep pushing folks let's keep pushing Got a little bit more to cover tonight All right, don't worry, this is still hard. If you need to see this again, that's okay. Come back on Sunday. We're gonna do a normal office hour. It's gonna answer about an hour of your questions and then we're gonna practice arrays. So come on back on Sunday if you wanna see more array practice. If you need to see something like this again, come back. We'll go do something similar to this again. All righty. Now, arrays, I said earlier, come with a lot of really cool methods that do a lot of heavy lifting for us, right? Another nine hours? No, I don't got another nine hours in me. That's a couple of times a cohort thing. It'll be a normal, I think, like three hours, sometimes we do like two to three hours on office hours normally.

Cool. Yeah, just imagine people like joining us from the folks joining us from the review and they're like, wait a minute, it's not at 9 hours every Sunday. Now we do like 2 to 3 hours normally already. We said earlier today that arrays come with some really good methods and we've seen some cool ones already. We saw four each which enables us to loop through arrays. Well there are some other really cool methods that come with arrays that I want to show you already. Here is a variable that I'm assigning a an array to. So I have best wrappers 2020 and on it we have 69, Ology and 69. And so what we want to do is we want to be able to to remove six nine from this list, okay? Thank you for the posture check. Hey, thank you for the posture check, let me get in here. All right, make sure I'm sitting good. All right, all right, there we go, beautiful. Alrighty, so we're gonna pull six nine off this list. There's something really neat that can happen, and that's that we have these methods built into the array.

So since we have this, or since we know this is an array, we can use a method here called shift. And what shift does is it removes, it removes the value that's in the front of the array. So in this case, we would shift off six nine from the array. It actually changes the array. That six nine on the front of the array gets pulled off the array. and we're left with just two elements in the array. And if we didn't store it in a variable, it would just poof, right? It would just poof and disappear, right? It would just poof and disappear. And so in this case, what we've done is we've shifted 69 off, but we've also stored it in a variable called removed. So if I ask for removed, you would get six nine. And if you went ahead and just console logged best rappers 2020, you would just see Polo G and six nine on the right hand side left. So if we can shift off the front, we can also do something called popping. And if you think shift pulls it off the front, what do you think pop does on the other side? yeah popped pulls 6-9 off the end as well so we wind up right now with best rappers 2020 we have two values in it polo G and 6-9 pop will pull 6-9 off the end and we stored it and removed again so if we needed it we could use it but if we looked at best rappers 2020 we're left with just polo G right we shift it We get 69 off the front and we pop 69 off the back.

And so now we're left with just pology. Cool. So if you ever need to pull something off the front of the array, what could you use, chat? If you ever need to pull something off the front of your array, what could you use? Shift, beautiful. And if you ever wanted to pull something off the end of your array, what could you use? Pop, nice. Alrighty, now we can actually do something pretty cool. Shift pulls something off, pop pulls something off. We also have unshift, which will put something on the front. So what I have here is best wrappers 2020, but what I have done is I am unshifting Dylon. So I'm putting Dylon onto the front of the best rappers 2020 array. And so if we were to console log best rappers 2020, we would now see Dylon and Polo G. So shift pulled off, pop pulled off, on shift put Dylon on the front. Beautiful.

We can also push. So if shift pulls off from the front and unshift puts on in the front, pop pulls off on the back, push puts on on the back. So if we look at best wrappers 2020 to start, we have Dylon and Polo G, but then we push Dylon onto the back of the best wrappers 2020 array. And so what we wind up with, if we were to console log best rappers 2020, we'd wind up with Dylon, Polo G, and Dylon. So these are all methods, right? These are all methods, right? These are all methods that enable us to interact with arrays. Shift, pull off, unshift, put on, pop, pull off, push, put on, all right? And so right now, if we look at best rappers 2020, due to our unshifting, shifting, popping, and pushing, we're left with Dylon, Polo G, and Dylon. Beautiful. Now, there's another method that I really like, and it's called map. What map does is it loops through an array but it creates a new array. So if we have best wrappers 2020 and in it we have Dylon Polo G Dylon and we run map on best wrappers 2020, if we run map on best wrappers 2020, what's gonna happen is that map will run three times because there are three elements in our array. Just like foreach would run once for each element, map is gonna run once for each element. However, map is pretty interesting because at the end it spits out a new array.

And so what map is gonna do here is it's gonna take in each of these values, but it doesn't matter what those values are, because the only thing that map is going to return is Dylon. So what happens is map runs once for each element. X becomes Dylon, then it becomes Polo G, then it becomes Dylon, but the only thing that this map is spitting is Dylon. So if we were to look at best rappers of all time, what it is currently holding at this time is Dylon, Dylon, Dylon, and we're close. We have two things we have left to do. If we're trying to figure out the best rappers of all time, we currently have three values, right? We currently have three values inside of this array. And so what we're going to do is we are going to unshift Dylon onto the front of this array. And we are going to push Dylon onto the back of this array. And then if we were to console log the best wrappers of all time, we would have Dylon, Dylon, Dylon, Dylon, and Dylon. This is peak education, folks. I spit the hot fire. This is it it does it it's all downhill from here If folks don't get it, this is a this is a Chappelle show joke, so Best rappers of all time or dial-on dial-on dial-on and dial-on, of course, so So, yes, I devised this whole lecture to get to Dylon, Dylon, Dylon, and Dylon already. Let's get some last bit of practice in and then we will review and then we'll do a raid. So let's get some best, the last bit of practice in here.

Let's go ahead and look at Winter Games. So I'm going to close all these here and let's look at overview winter games. And here it is. Create a function that takes in an array of numbers, return a new array containing every even number from the original array. You can try it one of two ways. You can try it with map if you want, or if you want a little bit more of a challenge, you can try not using map or filter, okay? I know this is a jump. A lot of folks, this is a jump. This is gonna be, it's gonna be a hard jump. Give it your best shot. Give it the old 100 devs try, and put five minutes on the clock, and then we're gonna go over it together. Give it a good old 100 devs try. I know this one's a hard one. It's alright. We're gonna Go over it together in five minutes.

I rip and I rhyme. I rhyme and I rip Way Dylan spits All right span it's alright give it a good try. If you don't know how to do all the pieces, get the function on the board, get a loop on the board, right? You don't have to get the whole win, right? Try as much as you can. If you're really stuck, go back and look at the slides, try and pull pieces from it. Don't just sit and wait. Give it a try. This is a hard one. We're ending with a we're ending with a hard one here. Don't worry. You can come back on Sunday. We're going to review. We're going to do things more. We'll go over it together and then we'll do a lovely raid.

What does map do? It moves through each element in the array, moves through each element in the array, but it creates a new array as it does it. If you're confused on it, MDN has really good articles on all these methods. You need to see push, pop, unshift, shift again, you need to see map, you need to see foreach, MDN. So that's okay. These ones, these ones are tough. These past two, especially the past two practice problems are really tough. I don't I you don't really have to feel bad if you're not getting these ones. These ones are tough ones for sure Make sure you do the homework. That was the array reading Make sure you go back and do the course that had a raise in it, you know About two minutes left, folks. a Minute left you got this dig deep try go through it together in the end Alrighty. Dunzo's a fun problem. I know this one's a little hard, but I did have some fun with it. A lot of the reading covered some of this stuff. There's a couple of readings and a couple of practices that use all the methods we covered tonight, and then we'll do more practice on Sunday as well.

All right, folks, come together. So let's do this one together. Alrighty. So create a function that takes in an array of numbers. Return a new array containing every even number from the original array. And the challenge was to not to use map or filter. So let's see if we can figure this out. Alrighty. Function, and we're gonna say only evens. That's a good one. And we're gonna take in an array of numbers. I'm just gonna call them nums. Could call it array, could call it robot, doesn't really matter, just a parameter. And we are going to return a new array containing every even number. So what I'm going to do is I'm just going to create an array called evens.

And I'm just going to create it using literal notation, right? Call it literal notation and create that array. So it's just an empty array right now, but that's where I'm going to store all my even values. Now, what I know I have to do is I have to loop through the nums, like the nums array. So I can just do nums and I can do for each and that's where I'll start. And I know that I need to take in each of the elements. So I'm going to call it, let's just call it n short for nums or I think we've been calling it like element or item. Let's just call it n, beautiful. And so now what we need to do is we need to see Okay, if it's even, what do we want to do? If we know that the number is even, what do we want to do? If the number is even, what are we going to do with it? Yeah, we can push it to the array. We just learned that we can put stuff into the array with the push. So let's check to see if it's even. We can say if num, we know how to do even by now, modulus two equals zero.

So if it's divisible by two and equals zero, we know it's even. And what we're going to do is we're going to push, push that value into the array. So we can do evens .push n. Okay. And then at the very end, return a new array. So we have to return that new array. So return evens. Okay. Let's see if this works. Let's call it. Only evens. And let's pass it in an array. Let's do one, two, three, four, five, six. And so this works. So we would expect to see two, two, four, six returned.

And we're gonna console log this just so we can see it. Cause remember if it returns, it'll just poof into thin air, unless we console log it. All right. So I feel good about that. Let's see where we're at. And let's go ahead and open this in the browser. Thought I clicked on it. There we go, sorry. Open it in the browser. Bachelor games, let's open up the inspector. Look in the console. And we can see that there is an array and the array has two, four, and six in it. So it worked. We can see that we console logged the array and that array had two, four, and six in it. So let's go back and take a look to see if we can understand what happened here.

But it did it did work Can I show map come back on Sunday and I'll show you how to do it with map first try That's definitely a first try All right. So let's take a peek Right now we're calling the only Evans function only Evans Only evens function and we're passing in right we're passing in this array. So wherever we see nums, right, wherever we see nums, wherever we see nums, it's an array with one, two, three, four, five, and six in it. I go ahead and set up an empty array called evens, and then I loop through my array. And each time it runs, how many times is my foreach loop going to run? How many times is the goblin going to go and grab a number? It's gonna run six times. There are six elements in the array, so the goblin's gonna run six times. The very first time it runs, the goblin goes and grabs the one. So is one divisible by two? No. Next time the goblin runs, it's two. So is two divisible by two? That is true. Two modulus two does give me zero.

So since that is a true statement, we go ahead and do this line. And what we're gonna do is we're gonna take this two and we're gonna push it into that empty array. So now our empty array has two sitting inside of it. Then we move on, the goblin goes and grabs three. It passes in three. Three mod two is not zero, so that doesn't work. Then the goblin goes and grabs four. Wherever we see N it's four, right? So four mod two, well that is zero. Two goes into four two times, there's zero left over. So this is a true statement. We take four and we push it into the evens array. So now that evens array has two and four inside of it. Then the goblin goes and grabs five. Wherever we see N, it's actually five.

Two does not go into five evenly, so that's a false statement. We don't do anything. And lastly, the goblin goes and grabs six. Wherever we see N, it is six. So we'll do six mod two, right? Six mod two, and that is even. Two goes into six three times, it is even. So since it is true, we do this line. we take 6 and we push 6 into the empty square brackets. So we wind up with 2, 4, and 6 inside that evens array and then we return that evens array and it gets returned wherever this sucker was called and it's as though we put in two, four, and six. You want to see it with a for loop or you want to see with a map, come on Sunday. I'll do them both on Sunday. Of course, I will always share my code after class, so I'm going to zip all this up. You'll have the code. Play with it before Sunday.

Play with it, right? Play with it. Make it do something different. If I did it with a four each, try doing it with the four. If I did it with a four, try doing it with a four each. Play with this a little bit. You gotta, especially if it's not sinking in right now, You got to get in the muck and play with it We got it. You got it You got to start playing with the sand to build a castle All right, I start playing with the sand to build a castle. So make sure That you're going in you're playing with the sand and that you you you you delete stuff you redo it You delete it you redo it you delete it redo it right make sure that you're still playing That's how you're gonna learn the most is by playing and building and so come back and play and build with this stuff You're gonna notice that there's a lot more slides here. Tons of stuff, wink, wink, wink, wink, that we're getting into next week. Lots of new stuff that's gonna be really fun and exciting, but please get through the reading this weekend. This reading's really important to make sure that it's not the first time you've seen or heard of objects, right? We're gonna be doing a lot of fun, it gets really fun. Next week is where I think class gets really fun for me, where we start using APIs and other cool things. And so please get the reading done.

Please play with the code, come back on Sunday. And then Tuesday, I have the best announcement ever. The thing I'm the most excited to have ever shared with you all. So please come back on Tuesday. I'm super, super pumped to share that with you all. And I'll see some of you on Sunday. Before we do all that, let's do a raid. You know, we always like to spread some love and positivity. So please give them some follows Make sure that you hang out for a little while. I'll see you over there and then I will share everything on discord So let's set up the rain We're going to me foo re me foo re Alrighty, I will see you all over there starting up the raid now. Get those sweet, sweet, sweet channel points. Thank you for coming back and pushing your mind with a raise for the second time. I know it's not easy, so kudos to you for putting in the work. Thank you for being here. I'll see you on Sunday, and then I'll see you again on Tuesday for the best announcement I could ever announce.

Peace, everyone. Have a good rest of your day. Let's read.

End of Transcript