INIT

Episode 6: JavaScript Fundamentals (Over)Simplified

Published:

Dude, in this epic podcast episode, Seth and Jake totally share their coding journeys and break down some rad concepts in JavaScript, bro. They talk about data types, variables, arrays, objects, and booleans, dude. It's all about understanding the basics and how these things work together, you know?

Then they get into functions, loops, and conditionals, man. These are like the building blocks of programming logic, where you can make things happen and repeat code, dude. They also drop some knowledge on objects and arrays, showing how they fit into loops and conditionals, bro. Just remember, loops and conditionals are crucial, but you gotta master other stuff too, like HTML, CSS, and backend integration, to ride the wave of building complete applications, dude. Catch you on the coding side!

Special thanks to Diarrhea Planet for our intro and outro music and @SkratchTopo for our artwork.

(Auto-Generated) Episode Transcript:

Seth Whiting: Hey, I am Seth Whiting and I am a developer from Portland, Maine, and I've been coding for about 10 years now. And I'm Jake

Jake Pacheco: Paco. I'm a barber from Augusta, Maine, and I've been coding for

Seth Whiting: seven weeks now. Seven weeks. All right. Seven weeks. It's good getting there. Yeah. You, you, you should pretty much know everything by now.

Yeah. Yeah. I,

Jake Pacheco: I think I, I think I could easily land most you know, mid-tier development. Yeah, definitely. I'm. Some things are sticking really well. But some things are still like, ah, like apparently I need more work on that.

Seth Whiting: Yeah, yeah, yeah. But yeah, I I we're getting there. You, you sent me something this week that I was like, oh, that's, that's gonna be fun.

Yeah, a screenshot of like a, a loop within a loop that, yeah, those, those get yeah, those get pretty tricky pretty quickly. Yeah, it did. And I,

Jake Pacheco: I, I just looked at, I still haven't done that problem cuz I was just like,

Seth Whiting: Nope. Exactly. I was like, I, well I literally, I looked at the problem

Jake Pacheco: and I said, you know what, maybe I'll go through the whole course again real quick.

Just a refresher on everything because like that just send me for is send me for a loop.

Seth Whiting: Wouldn't you know? Hey, a loop within a loop. Yep. A nested loop.

Jake Pacheco: Yeah. Is that what they call that? That's,

Seth Whiting: that's what it's called, right? Yeah. Hey, hey, hey. Cool. Yeah. So I've wanted to, for like a while, I've wanted to do an episode of just like explaining, hopefully in like plain English, what you can kind of expect to be working with in JavaScripts, really any development language, some call things, different things.

But they're, they're all gonna be doing very similar things to what I'm gonna be talking about today, which is just like the fundamentals of like, What makes a program, basically, and just kind of like talking about like the basic building blocks of like what, what you will be working with every day if you're, if you're a developer of any kind.

But specifically JavaScript. I'm gonna be speaking in JavaScript terms using the, the names of the things that JavaScript calls them specifically. So if you're like learning a different language and listening to this, you might be confused as to like, why is he calling it that instead of this? It's just like, you know, there's, it's like, there's not like a consensus of like naming conventions between all languages.

On, on this stuff since I'm just talking about like the very basics. Then there there might actually be a, you know, very there, there might. Not be anything different between what you, you know, languages call these things cuz they're so basic. But for certain things like loops, I think they use, they, they definitely use like different syntax and stuff that I might be talking about.

Like how you write a loop is kind of set up differently in one, one language versus another. So that, that might be like the one thing that, that differs here. Maybe, maybe like conditionals too. But anyway, so yeah, before, before I get into it any so I, I guess like the first thing I wanna talk about actually is like data types and do you have like a like a list of the data types that you've been working with?

And, and by that I mean like things like. Numbers, a k, a integers, and then things like strings. And then like objects. Do, do you have like a Yeah. A good kind of like base knowledge of like what those things are by now? Partially,

Jake Pacheco: I for the, for the most part, like, it was only, honestly, because again, I think that I spoke on it a little bit in the last podcast where sometimes they'll just throw out a word.

Mm-hmm. Just assuming you know it, or assuming, assuming that you know, what it pertains to. A lot of times, and to their credit to, to code academy's credit, they do like label things sometimes in diagrams, and when they do that, it's, it's really well done and stuff. Like, that's how, like I know what actual, like parameters are and what arguments are.

Mm-hmm. But still like, like the, sometimes it's difficult to. You know, you see it once and then later on they'd say in an instruction, okay, hey, do this with this argument and this parameter. Then it's like you know what I mean? It's, it's hard to, to kind of fall back to those, like, those thoughts.

Yeah. And try to remember exactly what, what it was talking about. So I do some Googling with that if I get stuck with that stuff. But yeah, a lot of a lot of numbers which, you know, brings us to the, the math talk that I, I like to talk about at some point later on. Mm-hmm. But, and then strings, strings seem pretty, I, I, I, I, I like working with strings quite a bit.

Mm-hmm. It, it all seems kind of I don't know, it, it feels pretty intuitive. Some of the number stuff, or if you're calling back to a string can get a bit confusing, mm-hmm. Just in the sense of like, you'll have like And again, this is one of those moments where I can't remember everything about the thing, so it's hard to describe mm-hmm.

Without knowing the name of everything, but I'm gonna call it like you'll have an object and what number

Seth Whiting: in the,

Jake Pacheco: what number string you have. Mm-hmm. Written as a number. So you'll have like, you know, the object and then like, zero, and that's pertaining to the first string in your what would it be?

Your argument. Do you know what I'm

Seth Whiting: talking about? I do know what you were talking about, but I think, I think you might possibly be getting mixed up between objects and a array, so Okay. In a array, you, you have a, a razor, so we'll get to what arrays are, but yeah. You'll often grab things from a arrays by their indexes, like by the Yeah.

Index of, of the item in, in the array. Yeah, which is

the

Jake Pacheco: number that I'm speaking of. Right. Start starts at zero and goes until however many you have in there Uhhuh. But yeah, like I said, like, like, like what just happened is just, it's, it, it's sometimes it's really tricky to remember every living. Yeah, for sure.

For sure. So I, I I, I have a, yeah, that's the, that's the one. Like someone could show me code and right now and I'll be like, oh, I, I know what this is doing and that this is talking to this and saying that to pull up this, they'll like, ask

Seth Whiting: me to name them and it's, you know what I

Jake Pacheco: mean? Yeah, yeah. So like, so yeah.

That, that can be kind of tricky, I guess.

Seth Whiting: Yeah. So I guess like the really, before we even talk about data types it, it might be better to talk about just variables in general first. Mm-hmm. Yeah. Yeah. Do, do you have like if I were to ask you to define what a variable is, like do you have a definition for a variable.

Gimme a second here.

Jake Pacheco: I, I, I guess the only way that I could, like try to describe it

Seth Whiting: is like

Jake Pacheco: a and, and, and I'm gonna use the word subject cause and, and I don't know if subject is used with something else, but like, it, it feels like, it's like a, a name of something that you're then going to define or work with. Mm-hmm.

So like you'll have like, you know if it's gonna stay the way it is, then you'll have like a cons variable. Which means it's in my mind, it's like, oh, so it's constant. Mm-hmm. And it's gonna stay the way it is. Yeah. And it's gonna be defined the way it is. That's, that's what it is. Or you'll have alet variable and you can, you know, have it, so that variable right now equals eight, but eventually you can change that at any point.

And yeah, it'll, it'll allow you to do that.

Seth Whiting: Yeah,

Jake Pacheco: so, yeah. I, I, I'm not sure if that answers your question at all, but like, it, it, it, it feels to me like it's a a, a, a piece of the code that I'm, that I'm working in, that, that is kind of my, my main subject line on like, Hey, we're working on this right now, and the rest of it is whatever, you know,

Seth Whiting: other stuff.

Sure, yeah. Yeah. So the, oh, no, that makes sense. If I were to, to give you like a, a synonym for a variable mm-hmm. Like, what else? Could you think of a variable as basically I would tell you it's a placeholder. It's like, okay, the, the variable. Let's say the variable like max, like for the maximum, like if you're, if you have like a variable called minimum and a variable called maximum, you could have the minimum equal five and the maximum equal 10.

So that you know, that you're, you know, you're working like with those things and you could, like you said, you could, you could change the maximum or the minimum at, at any point if Yeah. If they were set up to, to be changed. So like in that case, you would use the keyword let instead of the keyword cons, but but yeah, basically it's just like in algebra you have like X equals five, and if you do like X plus six, then you know that it's 11, you know?

Yeah. Or like, yeah, X plus six equals 11. What is X? You know, it's five, you know? Yeah. But, but but in this case, you, you always know. The value, you know, cuz you set the value. Yeah, so, so basically like, it's, it's just a placeholder, so you can think of it as x you know, in, in like an equation. So mm-hmm.

And the, the value that you can set for a variable, you can either say, like you brought up, you can set it up as a constant, which stands for constant. It's a constant variable, which means we're never gonna, we're never gonna change this. And if we try to, the, the computer's gonna yell at me, basically.

Mm-hmm. And then you can set it up as a let variable, which means let this equal, whatever I tell you to equal it right now, but later on I may change it. So, yeah. Yeah. Like cons is l let, is a bit like. Softer language, like Yeah, yeah. Just let it, it's just let it be that now. Yeah. Yeah. But and just a fun fact slash like history lesson, when I started developing, there was no concept of constant let in, in JavaScript.

There, there was, but it wasn't like adopted yet into like common JavaScript. And back then everything was a var, which is short for variable. So v a r. Yeah. Yeah. And yeah, they taught us how to

Jake Pacheco: write, write them in that. And I, and I, I was like, and then they taught us letting constant, I was like, oh, what was the point of me writing

Seth Whiting: things in bar?

Yeah, yeah, exactly. It's the same, same, same deal where like, this is how it used to be forever. Yeah, e s six changed that, right? I think e S five, ESS six, one of those somewhere in there. Yeah. Yeah. So I'm not sure. But yeah, at some point it, it updated to giving you like two different types of variables and VAR is still, you can still write it and it was still work.

Yeah. Yeah. And VAR worked, like, let, so mm-hmm. Let the, the, like, let type of variable was like the defacto one that you always used, like that type where you can change it. Yeah. But then they introduced cons, which like, now I, I don't know about most, but every project that I've worked on is like, I, I mean, most of the projects that I've worked on since I started using Cons, I, I've been like leading the project, so I've kind of been dictating this, but.

I think it's the case that most developers, and I, I could be pissing people off by saying this, but mm-hmm. I think it's the case that most developers use. There's sort of like a saying use cons till you can't. Yeah. It's like cons, stil, you can't, so like Yeah. Always be like strict when you're declaring variables until there's some, some case where it makes sense to use let, and there are those cases.

Yeah. Yeah. And it, it should be pretty obvious when you get to those cases. Like, I'm gonna want this to change later, so I'm gonna call it light. Yeah. Yeah. Yeah. So would, would, that, would, would that maybe be a situation in which maybe there's

Jake Pacheco: another variable that maybe the user would type in what that would equal and then.

And then you'd be like, okay, so then let this variable equal this plus the new number that the user put in. Kind of I, I, I'm just trying to think of like what, what that would

Seth Whiting: be maybe used for in general. Yeah. So, so it's like, does a better example I think would be like when you, when you are like incrementing something like mm-hmm.

If you, if you have in your, in your program you have like a counter and it's like counter equals zero. And then when somebody presses a button, it's like, okay, counter equals, so originally it would be let counter equal zero, and then somebody presses a button and then, and then you would overwrite that by just saying counter equals, yeah.

Counter plus one. So then it would be, you know, zero plus one, and then Yeah. Later on, if they press it again, it would be counter plus one again. And yeah. You know, from before that, it's now the, the, the value of counter is now set to one, so mm-hmm. Counter plus one would be one plus one, and then counter plus one after that would be two plus one, because you just added one to Yeah.

Yeah. So, yeah, that makes sense.

Jake Pacheco: Yeah. All righty. Cool. Yeah, that's, I was just curious

Seth Whiting: on what, what that would be used and there, you know, there are a lot of other use cases for it, for sure. Mm-hmm. But that, that's just sort of one that you might come across, you know, pretty Yeah. Frequently. Yep. So there, there are sort of like three ways to quote unquote declare a variable by saying, Counter equals zero, and it will always be zero.

You know, you'd probably call it like count constant number equals zero because you're not like going to increment it. Mm-hmm. And then you can do let counter equal zero, or you can do var counter equals zero. So there's yeah. Three kind of like keywords that you use to declare variables. Go ahead. Yeah. I also saw,

Jake Pacheco: Or at least like later on, they introduced you to basically putting an underscore before all of your I think it was variables.

Yeah. And it, it was just like to, to to kind of tell people, Hey, never change this. Is that, is that commonly used? Is that like a normal thing or am I, am I not talking about

Seth Whiting: variables at this point? Yeah, so I, I think what you may be talking about is, mm-hmm. With certain, like pre-written functions, mm-hmm.

Where I, I think it would. Probably not be the case that you would be the one to have written this, but Okay. Basically, with certain functions that you're using that somebody else wrote they have like, this function should always have three arguments passed to it and mm-hmm. Listener don't, don't get confused by this.

We'll, we'll come back to this, but Yeah, yeah. Sorry. If, if you're not using the first of those three, then you would put a an underscore in front of it just so that the, the, the computer knows like, some, some programs or like, like Vs. Code might mm-hmm. Kind of like throw up a flag and be like, Hey, there are three variables here, but you're only using two of them.

But if you have that underscore before the first one, it won't complain about it. It'll be like, oh, you know, you're not using it. Like, so now don't worry about it. That's interesting. Yeah. But I might not be talking about the same thing that you're talking about, but whatever you are talking about is not something.

If it's not that, then it's not something that I come into contact with often. Yeah. Okay. Cool. Yeah. Cool. Cool. So when you're declaring variables, you have those three keyword words, constant and var. Var is hardly ever used anymore. Constant let are used all the time. Mm-hmm. And so those are the way that you declare the variable, but then the, the variable name is whatever you want to call it, and that's the placeholder that you use throughout the rest of your code.

So instead of saying like, zero plus one, you would say counter plus one. Mm-hmm. And the computer just knows that, like you're talking about whatever you declared it as to begin with. So if counter equals zero, then it knows you're talking about zero at that point. Yes. So yeah. So variable values in this case counter equals zero.

The value of counter is zero, and zero is a number. There are, like I, I don't want to give you like a specific number of variables because not variables, a specific number of variable types. Mm-hmm. Because there are sort, there are some like esoteric types that. I, I may not even like know about, but the ones that you work with all the time are going to be things like numbers, strings, bulls, mm-hmm.

Objects. Mm-hmm. Arrays and functions. Yeah. So those are six that I named. I could be even missing one of the basic ones, but those, those are the ones that like you definitely need to know for sure. And I wanted to basically go through all of them. Mm-hmm. So the most basic one of all of those, I would say is the boo, even though it's like a, a weird name that you never, you would probably never come into like contact with or whatever if you're not programming something.

But Jake, do you know what a boo is by now? It's Bai

Jake Pacheco: basically a true or false statement, right? Or

Seth Whiting: something like that. Yeah. Is that Yeah, yeah, exactly. So exactly. It's, it's like, like

Jake Pacheco: zero's false, anything above zero is true. Or if it's a string, then it's true. And that's about

Seth Whiting: what I know, I guess.

I mean,

Jake Pacheco: it's, it's, you know, it's a, it's a true or false

Seth Whiting: statement basically. Yeah. Yep. Definitely. Good, good job with all of that. The, the only, the only part that isn't. Technically true with what you said is if it's a string, it's true. If you have an empty string where Yeah, there's just quotes that it's false.

Yeah, yeah, yeah. So, but yeah, so Abu is just a true or false value, and you use that a lot in what are called conditionals, which is not a data type or anything. This is like a, a, a type of like programming statement that will, that I plan to get into pretty much right after the the types here. But they're really helpful for saying if some condition is true, then do something.

If some condition is false, then do something else. So that if true or if false, that's referencing a bully in value. Yeah. So a lot of times it'll be like, if. Dog equals, equals cat, then do something, you know? Yeah. Which, like, that's, that will, you know, in that particular example, yeah. It should never be true.

Yeah. Unless, you know, unless, like you're talking about like the, the value of dog is like Sparky and the value of cat is sparky, you know, if you have the same name, I dunno. Yeah, yeah, yeah. Just throwing stuff off the wall here. But yeah. Would it be used

Jake Pacheco: in ai, like say someone was trying to log into a site and they had to put a username and maybe like, okay, if they write a username, then it becomes true and then you can work with it.

If they don't write a username, something else happens. Would that be kind of

Seth Whiting: a way to, is that how that works? Maybe. I don't know. So yeah, definitely. There's, there's a a. Concept of data validation in forms. Mm-hmm. And that's kind of what you're talking about, where like you can write in the logic where it's like, if there is a value in the username field, then allow them to submit the form.

Yeah. And, and you could write it so that if there is no value, then don't even show the button. Or like disable the button. Yes. That says like, send or Okay. Yeah. Or return or whatever. Yeah. You could even have it be like, if there is a value, then show the password field, you know, that kind of thing where like, yeah, you know, you could, you could make it do pretty much whatever you want, but like, yeah.

A, a common thing would be like, if n if not all of the fields are like valid like if they have. Numbers in the name field, or if they have letters in the, in the phone number field, then Yeah. You know, do something like hide. Yeah, yeah. Like disable the submit button, that kind of thing. Yeah, yeah. Yeah.

Jake Pacheco: I was just trying to think of like a practical use of where that might be, I mean, or where that might come up when you're writing

Seth Whiting: something.

Yeah. So there are like infinite, practical uses for boos. Like sweet. You could have like if a person has like certain like permissions, then show this section of the page and if they don't have those permissions, then, then don't show it. That kind of thing. Like, I mean, that's, that's like. Like I said, there's like infinite uses for bullying.

Yeah. Like you use them. Okay, cool. All the time in your code. Yeah.

Jake Pacheco: And would those be attached with a lot of like, if, if else statements? Yep. I guess then, yeah. Yeah, yeah. Pretty much, pretty much all the time then? Yeah. Yeah. Or, yeah. Yeah. Huh.

Seth Whiting: Interesting. Cool. So yeah, so Boo basically is true or false, mm-hmm.

Numbers, they're just gonna be numbers. You know, and you could have there's such a thing that's a float, which is sort of like, it, it's, I, I mean, you can have sort of like numbers, sort of like a blanket. Or like an umbrella category for like integers and then like floats and floats are numbers that have decimal points in them somewhere.

Mm-hmm. It could be, you know, it could be like 0.00005, or it could be like 10000000.1, you know, tho. Mm-hmm. Both of those are example of floats. Yeah. So and then integers would just be one, like numbers that don't have decimals. So like a million or six are both integers. Yeah. Yeah. And then, so you've got boos, you've got numbers, and then strings are super, super common all over the place.

In, in, I think any, any programming language, but definitely JavaScript where it's basically text that's sort of like the, the most Common use for it, where like, it's like text on a page or like the, you know, a title of a page or just like a person's name or any, any kind of text. It could be, and, and you can have numbers in strings if you wanted to.

Mm-hmm. Like if you have somebody's like, ID like, and, and this is like a throwback to one of the previous episodes where you were talking about ripping music off of somebody's Spotify or, or something like that. Mm-hmm. Or iTunes. Yeah, yeah. An iPod or whatever. Yeah, yeah, yeah, yeah. So I realized after, like, after the fact when I was like listening to it there's.

A, like, it's most likely what, what it actually was, was that it was referencing IDs. And those IDs were not in like, number form. There's mm-hmm. A lot of systems, like a lot of apps will have IDs in number form. So you'll start at, ID like one and then increment from there. So like, your user's table in your database will be like, user one, user two, user three, user four.

But there's another way to do it where you have just like a bunch of jumbled up characters in a string. So it would be like, user x, y 5, 9, 8 Z 4, 2 8, yeah. X, x, x five, one. Yeah. And then, and then it's just random. It's just like random for everyone. That, that sort of allows you to have like I, I mean, basically it allows you to have like a, a stupid amount of users without ever like, running out of numbers and like I, I mean, you probably wouldn't run out of numbers, but there's, I'm sure there's like a good reason for that, for using numbers, but there's also sort of like drawbacks to using numbers where it's like if you have a URL where it's like spotify.com/song/ 58 and you know that then there's like a 59, you can kind of like do things by like, you know, changing those numbers and like accessing things that like maybe you shouldn't have access to.

That kind of thing. Yeah. Yeah. Anyway. Tangent, but a string is like, you can have letters and numbers, and you can have like special characters, like exclamation points and whatever, like the, like all of that stuff. Basically, it's going to be represented between to quotation marks, and it could be single quotes, it could be double quotes, and it could be like what are called back ticks.

Mm-hmm. And there's lots of stuff that you can do with those. Yeah. Did you have a

Jake Pacheco: yeah, yeah, I had a, a thought on that. So if I had a booing as a string that was quote unquote zero, it, it would still be true, right? Because it's, it's something is written in the string, or would that be Yeah. False.

Yeah. Yeah. Okay, cool. Yeah. Yeah. I was just saying, I don't know, just

Seth Whiting: a random thought. Yeah, yeah. No, for sure. That's, that's a good thought. Yeah. So it, the, if you have a. Variable with the value of zero, the number zero. And you said and that, that that variable you called X. Yeah. You, you could check if x then do this function or something.

Mm-hmm. And if, if the value was zero, the number, then that would be false, so it wouldn't execute the function. Yeah. If that value were the number zero, but within quotes, that would be true. Because there, it's not an empty string. It there's something in the string, so it would be true and it would execute the function.

Yeah. Yeah. So makes sense. Yeah. So an empty string is just two quotation marks. Either double quotes, single quotes, or back ticks and. Without any space between. Without anything in between. It's just like a quotation mark. And then the next character in the string is another quotation mark that's an empty space.

Yeah. Yeah. If you

Jake Pacheco: put a space in there, then it would still be a string, would it

Seth Whiting: be? Yes. Yep. Yeah. Because it's gonna That would be true at that point.

Jake Pacheco: Yeah. Cause it's gonna console log those quotes basically. Yeah.

Seth Whiting: Yeah. And that true false value is basically saying like, something exists in this string or something doesn't.

Yeah. Yeah. Yeah. That makes sense. So a space could exist. Mm-hmm. So those are boos true false values. Numbers are numbers or floats. Like decimals and then strings or just anything between quotation marks, literally anything. Mm-hmm. Mm-hmm. And then, so those are sort of like the three, like basic, basic types.

I guess bullion is like the most basic, and then number, number and string are sort of in like the next basic. And then objects and arrays are in the kind of like more complicated variable types, I would say. Yeah, so objects, actually, I, I think it might be a little bit simpler to go with a arrays.

Arrays are basically lists and they're represented within what are called square brackets, and each item within those square brackets will be a. An item within the list. So you can have a list of strings, you can have a list of numbers, you could have a list of boos if you wanted to. And in JavaScript probably, especially JavaScript has sort of like a, a reputation for being kind of like, just like a, anything goes kind of language.

You can have an array of all three of those different things. So you could have a bully and then a strain, and then a number. Mm-hmm. You could probably do that in other languages, but JavaScript has that reputation of like, oh, a thing can be this or that at any given moment kind of thing. Hmm. So, yeah. So yeah, arrays are within square brackets and then each item in the array will be separated by a comma.

Yeah. So, Array our lists and lists inherently in, in programming, and it is like definitely in JavaScript are what are what's called iterable, which means you can step through that list, step by step, item by item, and do something with each of those items if you want to. Mm-hmm. And the way that you would do that is via what's called a loop, which we'll get to right after conditionals.

Mm-hmm. So so yeah, we'll talk about more, more about a raise in a bit there. But, but basically all you need to know is they are a list of other things separated by commas and represented within the boundaries of square brackets. Objects are the next thing and. I'm talking a lot. Do you want to give a shot at, at like at what an object is?

Jake Pacheco: An object? I mean, I would've been more comfortable with the raise, but that's fine.

Seth Whiting: Let me

Jake Pacheco: remember. Objects I mean, I don't wanna just say no, but it are, are objects.

I'm trying to think. I I'm just trying to go through other things that I went through in my,

Seth Whiting: yeah. In the lessons on the last, the last episode you said that you loved objects. Oh, yeah. Yeah. I mean, I like to race

Jake Pacheco: quite a bit too though, but yeah. And, and since the

Seth Whiting: last episode I've done more stuff, but yeah.

Yeah.

Jake Pacheco: But I, yeah, I, I mean this is where it's tricky because it's

Seth Whiting: like un. Object isn't a variable. It can be a variable, but Yeah,

Jake Pacheco: exactly. So that's what I'm saying, like that's why, that's why it's tricky, is because it's like in my head I'm going, isn't it? What we just, isn't it? Pretty much. But, but,

Seth Whiting: but you know, it's like, you want me to bail you out?

Yeah, yeah. Bail me out. Because it's like, because

Jake Pacheco: that's the, that's the, this is the problem that I run into is when they, like, they'll say like, five words that I've learned in the last seven weeks. Mm-hmm. You know, and, and I'm like, but isn't this this? You know what I mean? Like Yeah. Like, and, and it gets extremely confusing.

Cool. Well,

Seth Whiting: unless the thing is

Jake Pacheco: Yeah. Unless the thing is very easily defined in some, like a string can't be uhhuh anything but a string. You know

Seth Whiting: what I mean? Yeah. Right. Strings and numbers. Yeah. Those are pretty easy to remember if they're easy to, yeah. And like hard, hard to get confused. With like strings and objects or, or, or strings and numbers.

You know, they're, yeah. Yeah, so objects are basically like a collection of things and and by collection I mean like, it's like a grouping of, of variables or, or like other data types. So a, it, it would be more easily understood if I just gave an example, so. Mm-hmm. An example would be, I think you were working one with one that was like the captain or something like that.

So it's like, yeah, yeah, yeah. Captain. So you have the space captains. Yeah. Yeah. Okay. Now I can explain it. So it's like you have an object and so you, you can declare it as a, a variable. So you can say cons. Captain equals, and then you'd have what, what's called a curly braces open and opening and closing.

So they're like squiggly lines, basically containing these things. So arrays get square brackets, objects get curly braces, and they're, they're sort of like parenthesis or like, you open the, you know, the curve line, which is a parenthesis and then close it. But these are squiggly lines and you can see them on your keyboard if, if you're listening to this close to a keyboard.

So, and if you're looking at them, you'll probably say like, oh, he must be talking about these ones. So anyway, curly braces. Braces. Yeah. Curly braces. Braces open. And then you have different, they're, they're like variables within there. So is sort of like a list of variables. So, Con captain equals curly brace, favorite food, and then it, within these, instead of saying equals you do a colon.

So you could say favorite food, colon, space, mac and cheese, you know, and that would be a string. So that, that's the, the value of, of that. Like sort of like a sub variable within that object. So the captain, his favorite food is mac and cheese. And mac and cheese is like the, the value that you would access later on in your, in your program.

Mm-hmm. And then under favorite food, you could say like, favorite color, and then the value of that would be blue in, in a in quotation. So that would be another string. And then you could say favorite number for any reason. And that would be like favorite number colon. And then without any quotes cuz it's a number, it would be like 23 or whatever you said.

Michael Jordan fan or something. Yeah, yeah, of course. So so yeah, so it, it's basically like, one variable with a bunch of like, sub variables within it. Mm-hmm. So that, that's, that's basically how you can think of it. And to, to access the captain's favorite food, you would say captain dot favorite food.

And like, the value of Captain Dot favorite food is mac and cheese. Mm-hmm. Yeah. Yeah. Yeah. So that's how you access it. And so with objects you access those sort of like sub values by. The dot notation that I just mm-hmm. Described. Mm-hmm. With arrays, you could say you have an array of strings that's like Monday, Tuesday, Wednesday, Thursday, Friday.

So that those would be strings separated by commas that this is in, within the, the square brackets, cuz arrays have square brackets and values separated by comas. So the array, in order to get values from the array, you would say like constant days equals square bracket. Monday, Tuesday, Wednesday, Thursday, Friday.

That's, that's the, the array itself to get the values from that array, you'd say days square bracket, zero square bracket. And then like closing square bracket. And so days zero equals like, not equals You wouldn't write equals Yeah. Basically you would just say like, print out the value of days zero. Yeah.

Which is the first day in, in that array. Mm-hmm. Which would be Monday. Yes. In, in, in this scenario. And yeah, if you're listening to this and you're like, why is it zero? That doesn't make any sense to me. That's, that's a thing in, in JavaScripts and probably every other programming language. I'm, I'm not sure, but I would assume so.

But basically in programming, when you're, when you're, when you're working with arrays, they start at zero and, and go increment from there. So if you're trying to get the, the fifth value of the array, You would actually access it by doing like days square bracket four, because it starts at zero. Yeah.

And yeah, so Monday, Tuesday, Wednesday, Thursday, Friday, you're trying to get it. Friday you would do days square bracket four. Yeah.

Jake Pacheco: I, I had a thought, and I don't wanna lose it. Is, is just with objects. So, and, and this is another one of those moments where I could be talking about objects. I could be talking about variables.

There's global ones mm-hmm. That like go unchanged and just like stay, mm-hmm. As that and, and kind of like are all encompassing of the list beneath it

Seth Whiting: Yeah. Kind of a thing. Yeah. And is,

Jake Pacheco: if, if, I don't know if you wanted to talk about that at all,

Seth Whiting: Just.

Jake Pacheco: So in the captain thing that he's talking about that, that I had sent him,

Seth Whiting: It was you had a spaceship

Jake Pacheco: and it was filled with the crew members.

Captain was one of the crew members with its own information for the captain. But like for favorite foods that it also had like foods in the spaceship that were available, the captain was select selected the favorite food from that list of foods and stuff like that. Mm-hmm. So I, I guess what is the importance of using global ones?

Is it just so you can call back to information from that one versus

Seth Whiting: arrest, you know what I mean? Yeah. Like, yeah. So Yeah, it's,

Jake Pacheco: it's kind of all in one block or whatever you wanna call it. I, I dunno if you call it block,

Seth Whiting: right? Yes. So I, I'll tell you this, that global variables are very rarely used in, in actual Okay.

Programs. Well, well there we go. But, but they like, basically like global variables. And I may even be thinking of like back in like my PhD p programming days, but like basically you define them by like without using cons or let or var at mm-hmm. At like the top of your program. And like if you say, you know, captain equals, you know, launch on silver.

Yeah. Then and without using const, captain equals launch on silver. Then basically you can use that within like, Any of your like sub it's called Scope, basically. Yeah. It's like this, this variable exists within the, these like it's, you can use it starting here, but you can't use it outside of like this range because it's contained within Yeah, within this field.

Yeah. Yeah. It's basically like you can have like a class or you can have like a, a, a function that like everything with. Within there that you define within there. If you try to access it outside of there, it's not gonna, it's not gonna know where you're, it doesn't exist. Talking about Yeah. Yeah, exactly.

It does, does, yeah. That makes sense. Outside of that. Yeah. But the global ones exist basically everywhere, and you can access them from within wherever else. Yeah. You're, you're not gonna run into that pretty much. Okay. Pretty much.

Jake Pacheco: Yeah. I was just I was just curious if that, if that was a thing. Yeah.

Cause you know, no worries. They, they, they, it, you know, it took a while learning it, so, you

Seth Whiting: know, here we are. I'm joking. Yeah, that's fine. And I, I think I, I think that I'm talking about what they're talking about, but maybe, maybe they're talking about something else. Yeah. Who knows? But yeah. Anyway, so yeah.

So the a thing to know about objects and arrays both is you can have an object that contains an array. Yeah. And you can have an array that contains an object. And you can have an array that contains an object, that contains an array and, and so on. If you, if you wanted to, yeah, so you could have like the captain and you could say like employees and so the captain would be an object and he, it would have like favorite food, mac and cheese, but you know, colon, mac and cheese, favorite color, colon blue, favorite number, colon, 23 employees, colon square bracket, you know, an array.

And then within that array you could have objects of like the first mate favorite food, you know, like blah, blah, blah. Yeah. Like and, and, and so on. You know, so like you can, that's kind of how you set up like your data structure for, for the whole application. And. If you wanted to, you could say like like get, we'll get into loops, but you could loop through employees later on by saying like, captain Dot employees and then loop through all of the employees and say like, tell me the names of all the employees, you know, that kind of thing.

Yeah, yeah, yeah. So, yeah. Yeah. I, I, I, I, yeah, I, I was

Jake Pacheco: curious about how that, cause I, I think that, you know, when you say it out loud or if you read it, like sometimes it, it can feel very like at least for me and it might just be with the type of learner that I am, it probably is sometimes, like when I read something, I, I get all mixed up with the worst stuff when it's like, It's like, eh, sometimes I'll just scroll right down to like what it's going to ask me to do, and then it'll be like, do this.

And I'm like, oh, I know how to do that. Yeah. Even though like,

Seth Whiting: it's like, like,

Jake Pacheco: and, and if I did have a question, I'd scroll back up and like, figure it out. Right. But like, sometimes I get, I, I, I get too too mixed up in all of the, the phrasing and stuff like that. So like, then I just end up just like writing it the way that I believe that it should be written and it, and if it works and it works, and if it doesn't, then Okay.

Time for me to learn something new, I guess. You know what I mean? Mm-hmm. Yeah. That's just how I've, I've kind of been approaching it. Mm-hmm. Again, that's just, cuz that's how I, I, that's kind of learner that I am, I guess. Mm-hmm. You know? Mm-hmm. But, but yeah. So yeah. A, a, a, any of the questions, if they're curve balls or anything, or if it's something that we don't use, like we're not going to be using a lot, then I think it is good to, good to kind of have that in the back of my mind, just so it's like, you know, While you're learning all of this, it seems, it, it's, it can get overwhelming sometimes.

It can seem like, oh, oh my word, I'm going to be using all of this every day. You know what I mean?

Seth Whiting: Yeah. But it's

Jake Pacheco: like, no, like it's, it's you, you'll be using some of it every day and like, quite a bit of it every day. Maybe even, but like, not like, yeah. Like not,

Seth Whiting: it's, yeah. So I'm trying to give you like the, the basic building blocks of like programming and like all of this stuff that I have, like am laying out you will definitely use every day.

Sweet. Like sweet. Yeah. And, and it will be, it will be like a lot of what you use and you, you'll probably use other stuff at some point, you know, like every day you'll probably use something else. But this will be sort of like the bread and butter, like the, you know, the, the meat and potatoes I'm putting Yeah.

What you're using. Yeah. Most of what we're gonna be writing is, is these things. Okay, cool. It kind comes down to this stuff, so. Mm-hmm. You've got variables, you declare them with cons, let or var, and then the variable name, it can be anything that you choose that and those will equal bullion, a number, a string, an object or an array.

Sometimes it will be other things like dates, mm-hmm. But, but like, it's slightly less common. Like you, you do end up working with dates quite a bit when you're. Like developing a program, especially with like a, where you're storing data and stuff because you, you will very often have like a created at date of like, this user was created at this date, or updated at this date, or deleted at this date, that, that kind of thing.

Yeah. You just, it's good to keep track of that stuff. But if you're just like doing a just solely front end stuff, like, it's probably a lot less common that you're gonna be working with dates unless what you're working on is like a, you know, some sort of has something to do with like a calendar or, or like light tracker or something like that.

So, yeah. Anyway. So, yeah, there's like dates that you could work with. There's like times that you could work with and a bunch of other things, but like, mainly what you're gonna be working with is like boo strings, numbers, objects, and a race. Mm-hmm. And we just went through, you know, what, what all of those are.

And each of those can not each of those objects in arrays can contain other objects, other arrays, and they will always contain bulls, strings and numbers. You know, like the pretty much always it either at like the top level or nested within like the, the sub arrays or the sub objects or whatever.

Yeah. That those are going to be kind of like the things that you are ultimately getting at. So like mm-hmm. I'm looping through this array, within this object, within this array, just so that I can get at the captain's favorite food, you know, which is mac and cheese. Yeah. You know? Yeah. That kinda thing.

Yeah. So, yeah.

Jake Pacheco: So it's, it, it really is like I mean, the only way that I could describe it is like problem solving at that point. Then it's just like, it's it, so like I have a problem of like, I need to be able to write this, so it does all of this.

Seth Whiting: How do you do that? Mm-hmm. And

Jake Pacheco: like, and hopefully you have enough base knowledge that you can write it in a somewhat efficient way.

Right?

Seth Whiting: Yeah. Right. Yeah. So the, those are sort of like the, the types that you work with and then mm-hmm. Like as far as like the, the logic. So probably before I get into the, the logical parts that I'm going to be talking about, which are. Loops and conditionals, it would probably be good to cover functions, which is like mm-hmm.

You can have an array that equals a function, or, sorry, not an array, my bad. A variable that equals a function. So you could say constant divide by two equals function. And then within that function you'll, you'll have, you will pass what's called arguments. So a function is basically you, you have the word function, or you can have what's called an arrow function, where in each of these you're working with parenthesis and then curly braces.

So the parenthesis is where you pass data for the function to reference within the curly braces. So if you have, Divide by two equals function, then parentheses X and then after the parentheses you have an open and closed curly brace within the open and closed Curley brace. You would say return X divided by two.

Yeah. So that, that function will take any number or any data and try to divide it by two. But if you pass it a string, it's not gonna work. If you pass it a, a bullion, it's not gonna work. If you pass it in an array, it's not gonna work. If you pass it a number, it's going to divide it by two and return the value of, of that.

Yeah. Or the, I guess with dividing, you would return the, what is it with multiplication? It's a product with, mm-hmm. Addition. It's a sum with the vision. I don't know. I'm not smart enough. Yeah. Something I I, i,

Jake Pacheco: if it, if it, if it wasn't nine 30, then I probably could remember

Seth Whiting: Yeah. This is like coming back to math class that I don't remember, but anyway, yeah,

Jake Pacheco: it's, yeah, it's fine.

It's fine. Hey, we're learning coding here. We're not learning math,

Seth Whiting: like Yeah. Yeah. Kinda, kinda. So within a function you could do basic like math there, or within the function you could say, like, you could use a, a conditional or a loop, which we're about to talk about and, and spit out a value from that. Mm-hmm.

So basically it's like a call out to, to something where like you pass it some value and receive a value in return. Mm-hmm. That's, that's basically like what a function is. Yeah. And sometimes you don't even receive a value in return. You just sort of like do an operation and just know that that operation is done.

But Yeah.

Jake Pacheco: But yeah, I I was, I was gonna say sometimes is it like return, whatever, and it's, it's kind of like use like a console log or something like that. Yeah. So

Seth Whiting: sometimes, sometimes use like that. Sometimes you don't even use the word return. If you use the word word return, that means that you are going to get a value in, in, in return.

Yeah. But if you, you could, you could just say like, loop through these these numbers that I'm giving you. I'm giving you an array of numbers. I want you to loop through this whole array and divide by, divide each of these numbers by two and, and just like, Display them on the page instead of like or, or not display them on the page.

I guess like in that case you would be returning them and anyway but like for each of these numbers, just like print out to the console, like that's, that's a thing where like the console log thing that you just said. But yeah. So, but I, I think like that's, that's kind of getting in the weeds a little bit.

Mm-hmm. But basically it's just like passing data to something in order for it to do something with that data. That's, yeah. That's what a function is. That's what it's

Jake Pacheco: utilized for. Yeah.

Seth Whiting: Yeah, yeah. That makes sense. Yeah. So so you use functions all the time and then you'll use all of these data types all the time and in order to like build a whole program, the.

Basic building blocks of what you need to like actually execute, like the logic of an entire program basically boils down to loops and conditionals. You can do, you could build an entire application with just loops and conditionals. Mm-hmm. And like that is, you know, the, like, the bulk of like any application out there is actually just loops and conditionals.

And if you can grasp loops and conditionals and how they work with like a arrays and objects, then you can do so much. And so that basically begs the question, what are loops and conditionals? Yeah, yeah. Conditionals are sometimes just called if statements. Cuz. That's at least in JavaScript.

What, what, how you're going to basically write them. You're gonna say if open, parenthesis, some condition. Basically like anything that it, it's going to be some statement that equates to a value. So like if something equal equals something else and then there will be curly braces after those parentheses.

So it's a lot like a function, you know, it's written a lot like a function where like you have the, the condition instead of the arguments goes within the parentheses and then you open up some curly braces and then within that, that like, block of curly braces, you have some fo some code that will execute.

So, so it will be basically. If condition. And when you're writing when you're checking if something is equal to something else, you'll use double or triple equals. And that's to differentiate from when you are declaring a variable, you'll have a single equal. So, you know, variable X equals 12.

That's like, you're, you're saying this, I am saying that this equals this. I'm not checking if it equals this. I'm saying Yeah, this does equal this. Yeah. This, that

Jake Pacheco: recently dawned on me. That part actually, I was like, I was like, okay, so when or which used and I, I guess that's a question though. Cause I've been pretty much exclusively using the triple equals.

Yep. It, you can do double or

Seth Whiting: triple, doesn't matter. It does matter. And I will always use triple unless, okay. Unless I run into some. Weird esoteric case where it makes sense to use the double. Okay. There's the difference between using double equals and triple equals is you are checking with the double equals.

It's a bit like, it's a bit looser, so you can have, okay, like I, I, I'm pretty sure what it is, is like you can have something that equals a empty string, and if a variable, like if you have variable name equals empty strain, and then you have variable, title equals, nothing like undefined, basically like if you just say like variable, like let title and then just do semicolon.

Where you don't, you don't say it equals anything that will then just be undefined. Like there will be a variable, but it won't have a value, so it'll be undefined. Yeah. So yeah, the, the difference between double quotes and triple quotes is basically like if you're using triple quotes, it needs to be exact.

Like you, it needs to, like, if, if you have a empty strain, that's not going to, that's not going to equal a, an undefined value or a null value. That those are like they need to actually be undefined or actually be null in order for, for that to, to go through. So so it's just sort of like safer to use triple triple equals because it's, yeah, it's basically makes more sense.

Like, does this equal this? Yeah. Double equals would be like, It could maybe sometimes. Yeah, yeah, yeah. Yeah. Sugar equals is like, no, it doesn't like, yeah. Well it's a

Jake Pacheco: string or something instead of like, it being like, actually the name John or something like that.

Seth Whiting: Yeah. I think, I think the only thing is like what's called falsey values.

That's, that's like anything that will equal to false is like Yeah. Undefined, empty string zero null, that those are all falsey values and, and then like false itself is, is a falsey value. Yeah. So I think that's the difference is like double equals, if something is falsey, it will equal something else that is falsey.

But if you have triple equals, it's like it needs to be the exact right type of falsey. Mm-hmm. In order for it to, to actually. Yeah. You know, equal that thing, so, yeah. So I, I'm pretty sure I'm getting that right. It, it could be getting wrong, but I'm pretty sure I'm getting

Jake Pacheco: that right. So basically I like triple equals, make sure the depth of meaning is what it is instead of just like, it, it, it being, it having any wiggle room.

It is, it has

Seth Whiting: to be this kind of a thing. Yeah. And it's really only with those like falsey values, like it's never gonna be like, oh, this string is sort of like this other string. Even with double equals, it'll be like, no, that's not the same string, obviously. Okay. Yeah. It's only like, so it's, this is, this is false and this is also false, but they're not the same kind of false, but they're both false.

So I'm gonna let it it slide kind of thing. Yeah. It's really just faulty.

Jake Pacheco: Yeah. Best practice is to use triple equals because it leaves no questions asked. Yeah. Versus double equals. It's just kind of a, it's, it's not. It, it, it, it feels like it's less organized or something. It's like it's, it's a bit less it's like a bit looser.

You, you could write everything with double equals honestly. Yeah. But, and the outcome would probably be the same, but it's like, eh, for to make sure to Sure. It up kind

Seth Whiting: of. Yeah. It's like to two it with three. Yeah. And like 1% of the cases that you use the double equals you might run into like, oh, I don't actually want that to go, to pass the check, you know?

Yeah. Yeah. So that makes sense. Yep. Yeah. All right. Cool. Yeah, so the conditional statements are basically just if statements and when you use if statements, you can use things that are called else. If so, like you have a, a variable that could be equal to any color. So you could say like, if color equals equals, equals blue, then you know, do something, say like, You know, console log.

Wow. I love your blue dress. And then if color equals, equals, equals pink, or, or sorry, else. If, so, like, we've established that it's not blue, so in another case if it's pink, then console log, like, wow, pink is my favorite color, you know? Yeah. Something, something else. Or, or you could just have

Jake Pacheco: a and then you end it with else, right?

Yes. Just saying like, yeah. Otherwise you'll say,

Seth Whiting: yeah, it's a nice dress. Yeah. For, for all other colors, just say like, I don't like that color. You know, just like console, console log. Like, I don't like that color. Yeah. I'm not really into that. Something like, yeah, yeah, yeah, yeah, yeah. Or, or like, you know I prefer blue or pink or something like that.

And so, yeah. Yeah. Something like that. You know, that's a terrible example, but like you, you kind of get the, the idea where it's like the initial condition is like if color equals, equals, equals blue, do this else. If equals, equals, equals sorry, color equals, equals, equals pink. Do something else. And then else, you know, for all other values, do you know this, this sort of like default condition, like this default action.

Yeah. So yeah. So that's sort of like con conditional statements in a nutshell. It's the, they're, they're just sort of like gating certain things from happening and, you know Yes. If certain conditions are met, do certain things. Yeah, exactly. It's, it is

Jake Pacheco: literally you're working on, on the condition that this is met, then this happens.

Yep. And.

Seth Whiting: Else this happens uhhuh, it's

Jake Pacheco: just on conditions. Yeah, that makes

Seth Whiting: sense. Yeah. Yep. Yeah. Or, or like a lot of the time you could say like if color equals equals, equals blue, do something and then just leave it at that. You don't need an L statement. You could just say like, oh really? Just leave it at that.

Yeah. So like, because if color does not equal, equal, equal blue, then we just don't want to do anything. It's just like we're not worried about Yeah. We're not worried about those things. Cool. So like, yeah, we're just not gonna do anything. We're just looking for the ones that are blue, and when they're blue, we're gonna do something.

Okay, cool. Yeah. Interesting, huh? Yeah, so those are conditionals and then loops are a, a bit harder to get your head around, but a simple way of of, of like talking about them I guess, is just. Whenever you have an array, it's a list of, of values within that array. And those values could be objects or other arrays, but to simplify things, like if you have a a, an array of strings of colors, say, and you have like red, orange, green, blue, violet, you loop through those things.

So basically when you have a loop, you're working with an array. That, that, that's what you loop through. So if you have po colors equals square bracket, red, you know, within, per, within parentheses, each not parentheses, sorry, quotation marks, each of these. So quotation marks, red quotation marks, orange, all the way through to violet or purple or whatever.

Then you can say, Four. And then, so like I, I'm kind of doing like the, the most complicated loop here mm-hmm. To start out with. So I, I, I don't wanna do that. Actually, I'm just gonna say originally there's something called a four loop, which was, I'm pretty sure like the, the, the first and maybe only one that you could work with for a while.

Mm-hmm. So, and it's sort of set up in, in sort of like a complicated way where like you, you set up like a value where it's like four and then in parenthesis let e or I, I guess for, for index, like we're looping through the indexes of this array. So let I equal zero and then semicolon I is less than 12.

Semicolon and then I plus plus. So basically it's saying like, increment the value of I until it's no longer, less than 12 is, is what that's saying. Mm-hmm. Yeah. And if you have an array, you could say like, the colors array, you could say, let I equal zero I is less than the length of this array.

Mm-hmm. And then increment I after that. Yeah.

Jake Pacheco: So, sorry, are you saying, so when you say the length of this array mm-hmm. Are you saying like, say there's five colors in it, so you'd say let I equals zero and then it would be, the length of the array would be four

Seth Whiting: Actually. The length, the length of the array Okay.

Is five. That's, that's sort of tricky. So the, the last, the last index of the items in the array is for. But the, when you are grabbing the length of the array, it's actually, it's starting, it's starting from one. So it's just like really tricky. Yeah. Ok. Alright.

Jake Pacheco: Well that's why I wanted to clarify it. Cause I was like, I was like, wait, is that, is, does that work the same or not?

Yeah. Okay. So when we're working with length, it starts with one.

Seth Whiting: Yeah. Yeah. So it, it sort of results in you having to do like a lot of things like

colors, dot length, minus one. Like, you know, you're, you're trying to access the last item in the array you have to do minus one, which is really dumb. But anyway so to simplify things for everyone, don't worry about four loops. Like you, you will encounter them, but start with a more simple loop, like a four each.

So you can say, Colors dot four each, and then you open parentheses, and then you have a, a function within there. So, and, and usually in today's JavaScript, you'll use an arrow function as opposed to the word function. And that function, the first parameter that it will give you for that function is the value of each of the items in that array.

So if you say, colors dot four each and then open parentheses and then open the parentheses of the function, then you can name the parameter color at that point. That would be the thing that makes the most sense. So for each colors for each of the colors, you can have a color, and that's basically just looping through in order all of the colors.

So you could say console log color, and it would give you a list of red, orange, green, blue, indigo, violet in your console, you know, all on separate lines. Yeah. Huh. That makes sense. It's

Jake Pacheco: it's, it's tricky cuz a, a question that I'm currently on is basically it, it's the one that I sent you that I was like, what?

Seth Whiting: Yeah yeah, yeah. Was

Jake Pacheco: basically asking me to name playing cards and each number on each playing card it basically list them all out. Mm-hmm. And it's like, What you just described, where it's like simple, just like one, you know, one thing. Mm-hmm. But like, once it becomes more than one thing, I'm like, oh my

Seth Whiting: word.

Yeah. You know, so I, so

Jake Pacheco: that's where I went back and like, I'm like, okay, I, I need to relearn a little bit. Cause like that's like, you know, it's, it's, it's, it's, I'm,

Seth Whiting: yeah. What Jake is talking about is basically the, he's using a, an what's called a nested four loop, where you are accessing, like if you have colors, then instead of having a four each, that gives you color.

And that's just each of the colors within the, the array. In order it's, it's asking you to access each of those colors by the name of the array, which is colors, and then the square brackets. And then I, which is the thing that you're incrementing, so it starts at zero. So you're gonna grab the first one and then, It'll do whatever you want it to do in that loop and then increment so that you're accessing colors, square bracket one, and then colors square bracket two, and then colors square bracket three, which will be each of the values in that array.

When you get to a nested array, you have like I that you're incrementing for the the first loop that you're talking about, and then you're looping through things within that loop, so you can't use I anymore. You have to use something like J. A lot of people will just use J because it's the next letter I is supposed to stand for index, because you're grabbing the indexes that that's basically when you're working with arrays, each item in that array will have what's called an index, which is just a.

Which number is it? You know, which order? Yeah. Is it? So and people just use I for when they're using for loops because it's faster or like more concise than using the word index. So they end up just saying, I, and then I is less than the, the length of the array, and then I plus plus for the their four loop.

And then if you're using a nested four loop, then you can't use I anymore because that's always gonna equal the value of, you know, the, the index of the, that first loop. So then they just use J because it's the, the, the next letter. So you have like, basically like you can have an object. Like an array of objects.

And then within that array of objects you have an array. So like, like I said before, if you have like the captain and then you have like his, his favorite food and you have his favorite color and his favorite number, and then you have his employees, that's an array. So if you wanted to grab each of those employees and you wanted to grab like each of their like family members, like the, if those employees, like that array of employees then has an array within there, and you want, basically like you start at the top and all you want is like each of, each of this person's employees.

Family members' names. That's like what the values that you're trying to get at. Then you have to do a loop within a loop, and then sometimes a loop within a loop. Within a loop. So it's, if you're using a four loop, it gets really muddy really fast. Mm-hmm. If you're using a four each, then it's a lot easier.

So you can say like, employees dot four each, and then employee, that's like the, what you're working with. So you know, like, yeah, the dot four each, and then it'll give you the, the function and the first perimeter of that function is always going to be the values in order. So that will be, you know, the value, each of the values within the employee's array is going to be employee.

So just call it employee, why not? So, and then, so for each employee's, or for each of the employees then you have employee, and then you can do employee.family members and then do four each. And then you have like family member that you're working with. So there also, yeah. Huh. So it's, it's interesting.

It's a much clearer, and to be fair, you could just say within your for loop, you could just say employee square, bracket zero, or sorry, you could say constant within this loop of, of, of like four I equals zero I is less than the length of employees. And then I plus plus. You could just say within that loop, The first thing that you say in that loop is constant employee equals employees square bracket.

I, and then it, you'd pretty much be doing the same thing, like you, you, you interesting, but a four, each loop just does that for you. Yeah. If that, if that makes sense.

Jake Pacheco: Yeah. Yeah. That makes sense. I, I feel like they they hung up on the what, what was it again? Four. Let or, or let for this. Okay. I, I feel like they hung up on that more than I, I've gotten into like, I think I've just like, just learned a bit about the before each.

Yeah. And like, it, that's the thing though, is also like, I, I wish that there was a clearer distinction

Seth Whiting: between the two. Mm-hmm. You know, just like the,

Jake Pacheco: the bar versus versus let, it's, it's sometimes it's, I. It's not hit home enough that it's like, Hey, by the way, no, no one uses let, uses this bar anymore.

They, they're using Let or, or they're, and then, and then even with that, most people are using Const. You know what I mean? Mm-hmm. Like it's, I I sometimes there's things like that, which I'm glad that I talk to you about it because it's like, yeah, I, I don't, you know, tho those don't hit home that it's like, not like you use four each usually Yeah.

Because it's, it's a simpler yeah. Simpler to write it or kind of better to write

Seth Whiting: it that way. Yeah. And to be clear, you will run into four loops within Yeah. Code bases. I will pretty much avoid them like the plague. In, in my code, just because the, they're, to me, they're like the most confusing loops to, to work with other than reduce, actually reduce can get, like, really?

So the, the thing about reduce and like, this is just a side note, don't worry about this. Mm-hmm. Cuz mm-hmm. You're not gonna understand this, but there's a loop called reduce that is super, super useful. Like, it, it can save you like a lot of like computing power and stuff, but it's really complicated. Like if, if you're using it to like save you a lot of computing power, you're almost always going to be writing code that is like very hard to read.

So, huh. Interesting. But yeah, loop cause Cause

Jake Pacheco: I learned, I learned some of that reduce and uhhuh and just none of this was

Seth Whiting: mentioned, you know what I mean? It's like, you know. Yeah. But four loops are. Really hard to understand, like just inherently and don't save you computing power versus like a four each or a, a map or something like that.

Like there are several other looping functions that do what you're trying, like pretty much always what you're trying to do in a four loop, you could do with a, with a more easily understood looping function. Yeah. So yeah, four each is a good one. Basically anything that you can do a, in a four loop, a four each is just a simpler way to do that.

M map and filter are really useful functions, but they sort of do like specific things, like more specific things. Yeah, like four loops are just general purpose loops where you can do, you know, you're just looping through things and you can do whatever you want within those loops. It's a kind of a thing.

Yeah. And a map is like when you have an array of a specific length and you want a new array of that same length, but with like, just slightly different values basically. And then a filter is going to be like, you have an array and then you want a new array of like just the values that you're looking for basically.

Yeah. So they're, they're not like general purpose, like a four loop is, and then a four each is general purpose and it's more clearly understood. So I will pretty much always use a four each, over a four, but more often than not, I'm. Using loops for a specific purpose, like a map or like a reduce. So I'll, I'll reach for those before I'll reach for a four each, like, yeah.

Yeah. But I'll, I'll avoid four loops. Yeah. All day, every day. Like, I, I don't like working with them. Huh. So

Jake Pacheco: basically the way that I'm understanding it then, is a four loop is like a complete sandbox. You just, you can do whatever you want with it. Mm-hmm. For each is like a step in the right direction in the sense of, it's just, it's, it's easier to use, but maybe not as adjustable.

Seth Whiting: Or is it? I think it pretty much is. Okay. Like, yeah, it's just like a clearer way to write a four loop. So yeah, for me then it's like, basically my thinking is like, there's really no excuse to use four, but Okay, cool. People still do. I, yeah. So

Jake Pacheco: then on top of that, it's like what you really want to be using is odds are there's a a function that does it already.

So you want to use a map or a filter or

Seth Whiting: something like that. Yeah. Yeah. And then there's other ones like I, I, I know there's like a function find. Yeah. There's a find where like you're trying to find a specific like mm-hmm. Item within that array. And then there's, yeah. Ones where like, some where like you're just trying to check if an a value exists within an array.

It's like once or any number of times, like if it exists at all, return True. Like in that loop, you're actually returning a boo. So just like, not like you don't need to retain that at all, but basically like four loops are sort of like the original loop, I'm pretty sure within JavaScript, and you should definitely understand them because you will come across them.

But when you're actually writing new code, I would always use a four each. Over a four. Okay, cool. Yeah, so cool, huh? Yeah. But yeah, so the w so within those loops you can use conditionals and often we'll use conditionals. So like, you know, for each employee, if employee, dot name equals Steve do something.

If employee do name equals Bruce, do something else. You know? Yes. Like the, it's so you can do. Almost anything with just loops and conditionals, and those are like, and within the conditionals and loops and stuff, you're trying to get at those in like original values that I was talking about, like the bulls, the numbers, the floats, the strings.

Like if you understand objects and arrays and like how they work with loops and conditionals and how like the, the different values work with like the strings and the numbers work with objects and all of that kind of stuff. Like everything that we've talked about in this episode. If you understand all of that stuff, what they are and how they work together, you can make a.

Pretty much anything. It's, it's pretty crazy. Interesting. Yeah.

Jake Pacheco: So, and that's kind of like I, I mean, because obviously you could, you could know all that stuff and make a lot with it, but it's, it's basically those are your, it's almost like the, the thought process that you want to go to mm-hmm. Is using these things to make this happen.

Yeah. And so, so what you're saying is like, you can, you can use these to make anything happen, but, you know, we'll, we'll obviously go more on like how that actually Equates to an application

Seth Whiting: running Yeah. And stuff like that. Yeah. And when I say like, you can, you can pretty much make anything I'm talking about like you can pretty much make the logic behind anything.

Yeah, yeah, exactly. It's, you're, you're gonna need some like HTML and c s s and you're gonna need to know how, how what you're writing in the JavaScript relates to the HTML and c s s and, and like exactly works to like enhance it and, and all of that. And then you're also going to need to know how to like, ping a database or, or like ping a backend that pings a database and then return something for you to loop through with conditions and stuff on the front end in order to display stuff on the page, you know?

Yeah. Yes. It's, there's, there's other stuff to do, but like, as far as like the logic and like writing programs, it's very. Very like huge percentage of all of it is just gonna be loops and conditionals. Yeah. It

Jake Pacheco: makes it, it makes it feel a lot more approachable thinking, thinking of it that way cuz it's something that like, I now have I, I can kind of focus it really heavily on those and mm-hmm.

And just really understanding those. Yeah. If that's mostly what I'm going to be writing when I'm writing stuff. Yeah. Yeah. Or the, the, that's the way I'm going to be thinking

Seth Whiting: when I'm thinking of stuff. Yeah. Yeah. Cool. Well, cool. Yeah, this is, you know, one of the more straightforward episodes. And I think that's, you know, all the time that we have.

But you know, I wanna get into more like talking about like what you're going through and all of all of that, like what you're learning right now on the next episode. Mm-hmm. For sure. But yeah, I th I think it's good to kind of like have these, throughout where it's like, you know, the, the basic building blocks of a webpage was one of the episodes that we did before, and this is like the, the basic building blocks of like coding and specifically JavaScript.

And like, I, I think that these particular episodes are valuable in their own right, but, you know, the, the ones where we're just, you know, talking about like programming in general, like the a day in the life and like the, you know, the more, well it's, everything around programming are a different type of valuable, but I think they're both, yes.

Like we, we kind of need both. Definitely.

Jake Pacheco: Yeah, because it's like, I, I mean,

Seth Whiting: because. When you

Jake Pacheco: first get into it at all anyways, you're, you're confused at just the prospect of what the heck even is any of this. Mm-hmm. Yeah. Yeah. You know what I mean? Yeah. So I think that those episodes were helpful as like an introduction, so, you know, some of the terminology and some of the ideas of mm-hmm.

What this actually does. Yeah. And then this is actually putting it into practical use. Mm-hmm. And so I think that we will definitely do more of these episodes upcoming. And maybe even just have those be a firm introduction to like the world that is this. Mm-hmm. Because yeah, so everyone knows currently, and I'll have it, I'll have these in the descriptions as well, like tracking my own progress.

But currently I've just finished their, and when I say their, I mean code academies full course on learn JavaScript. And I've just. Just begun just finished the first like course or whatever on intermediate JavaScript. So I'll try to keep track of that on per episode just so people can kind of track their own progress with that as well.

But, but yeah, I, I think that, I think that both have kind of their place and we will do more episodes,

Seth Whiting: but I just, cuz I have, I still

Jake Pacheco: obviously have a ton of questions about a ton of different stuff, so. Yeah. Yeah.

Seth Whiting: Yeah. Cool. Cool, cool. Sweet. Well, thanks dude. Yeah, and thanks for everyone for listening and yeah, think hopefully, hopefully this helped clarify some stuff for some people.

That's, yeah. Yeah. That's the, the hope. But yeah. Keep, keep going, keep keep swimming and yep. We'll talk to you next time. Yeah.

Jake Pacheco: All right, everyone thank you again and have a,

Seth Whiting: Have a great day. Cool.