Check out a free preview of the full Complete Intro to Web Development, v3 course

The "Builtins" Lesson is part of the full, Complete Intro to Web Development, v3 course featured in this preview video. Here's what you'd learn in this lesson:

Brian demonstrates some of the commonly used functions built into the browser. Built-in functions for strings, numbers, and a time-related function are covered in this segment.


Transcript from the "Builtins" Lesson

>> Let's talk about builtins. Builtins are just functions that someone's already made for you. They're built into the browser, that's why they're called builtins. So a really good example of that, we have this sentence, which has the infamous SpongeBob casing, which I did not invent. This is actually called SpongeBob casing, where it's alternating caps, right?

There's a function built into strings, right, that says, called toLowerCase. It'll take this SpongeBob casing and it will make it have lowercase, right? You probably expect that there's also one called toUpperCase, also works as well. This function is built into all strings. To the point, we can actually just move this directly onto this.

I know this looks a little weird, but this does work, right? But that's what this period means, is it means you're calling a function onto something, right? So I have sentence, and I know sentence has a function built into it that I can call called toLowerCase, that's what the dot means.

It's like I'm reaching into the sentence to call this function. You'll frequently hear this referred to as a method. For all intensive purposes, you can kind of just make function and method the same word in your head. There's a difference there. A method is built into something, a function is any function that you can run, right?

I just say that because I use both terms very frequently and I don't wanna confuse you. If I say method, I just mean a function that's built onto something. Okay, so Brian, how do I know what functions are built into things, right? What other methods are on strings?

Well, one, VS Code is actually very helpful with this. So if I make a string here, right, and I say string., VS Code is smart enough to say, I know this is a string, cuz I saw you declare it, right? Here's everything that I know about strings, and so these are all functions you can use on strings.

So what's a good one? Well, I showed you padStart not too long ago, right? That was one of them. How about, what's a good one? Split, split. Let's not do split, let's do substring. And again, it gives you lots of helpful things like, all right, I'm expecting a number here.

So where do you want to start? So let's make this a bit longer, say, hi, my name is Brian. And this is a string that says, hi, my name is Brian, and I wanted to just say my name is Brian. So I wanna cut off the first three letters, right, the h, i, and then the space there.

So you're gonna start at 0. So 0 would be the very first letter, then 1, then 2. And I think I wanna start at 3, and that have to start here. And then I don't need the end character. If I wanted it to end first, right, so I could say, my name is, and cut off Brian as well, but let's just leave that off for now.

And get rid of this as well. Console.log(string). Yeah, and you have to store it as well. So let's just say, let string and string =, right, cuz it was returning something and I was ignoring it, basically. It doesn't modify the string itself, it gives you a new string back.

So there, now we have, my name is Brian. That's another built in functionality to strings, so you can take some strings out of them. If I wanted to, Get it to here, where Brian is, I have to take, Let's see. We can kinda just guess and check here.

Yeah, so this just has my, right, because I went from 3 to 5, and the fifth index here is this one. So if I wanted to get all the way to my name is, I'd have to go 1, 2, 3, 4, 5, 6, 7, 8, 9, so I think this would be 14.

And there you go. One too many, it'd have to be to 13, cuz I got the extra space in there. There we go. So that's taking the string and then it's returning to me starting from character number 3 all the way to character 13, which gives me back this middle string.

So all this to say is, this is all stuff I can't remember off the top of my head. I don't remember how these functions work, right? There's so many functions built into JavaScript. VS Code can be my little helper, cuz it has all these documented things directly in here, right?

Which I think is pretty cool. Now, a perhaps more better way of looking at it is you can go to the MDN, which is Mozilla Developer Network, which is a documentation here, and I can look for string. And here, I can see all of the various different functions built into string, and there is a lot, right?

But I mean, frequently, I won't even do that. I'll just Google javaScript extract string, something like that. And you can see here, there's five different ways that it'll tell me how to extract strings out of it, Using substring. Okay, A lot of it just comes from getting more familiar with what JavaScript can do, and you'll just get used to it over time.

Yeah, I just wanna emphasize again, Googling things is not cheating, it's part of your job. Being a really good developer is just being really good at Google, for the most part. It's talent, it's literally something that's required for you to do your job well. I like to emphasize that, because there's this group of overachieving students from high school.

They're like, I'm not gonna look at it in the book, I have to remember it, cuz my chemistry teacher made me memorize how to do redox equations or something like that. Not that, throw that attitude away. Just live your life in Google, it's totally fine. Copy things from Stack Overflow, break things, that's what you're supposed to do.

So how about if you wanna round a number? Let's say I have a number and I want it to be rounded up or down. You can use Math, which is a kind of universally available object that has a bunch of useful math methods on it. Round is one of them, right?

So, You have rounded number here. So number is 5.3, but if I put rounded number here, you get 5, Which is cool, right? If you need to round something, it'll round it to the nearest whole integer. You can also do floor, which will always round down. So even if this is 5.999999, it'll still round down, that's what floor does.

And you can do ceiling, right, always rounds up. 5.1, still rounds up. So there is, let's do this instead, number. There's also Math.random, if you need a random number, which will give you a random number between 0 and 1. So it's gonna be some long decimal. But notice if I keep changing this, I get a different number every single time.

Kind of fun, right? And I'm just deleting that semicolon, inserting, because every time I delete that, it rebrands my code automatically, that's why that keeps evaluating. Keep in mind, this is still pseudo-random, it's not true random. That's a big thing in the computing world of what's random and what's actually pseudo-random.

Technically, if you know enough about my computer, you could guess what the next number is gonna be. So therefore, it is pseudo-random, it's not truly random. It'd be hard to figure it out, but it's possible. But for example, if you're, I don't know, mining Bitcoin or something where money's on the line here, someone actually might be incentivized to try and figure it out.

And the fact that it's possible means someone could. Whereas if you're taking atmospheric interference and things like that, things that really you can't predict, that's a true random number. This is not true random. That's kind of fun, right? Okay, So we wanna see if one string contains another string.

So let's say I have a word here that I'm looking for called cute. And the first one I look at is, The quick brown fox jumps over the lazy dog. Does cute exist in that string? No. Or how about this? I think this is a Lizzo lyric, I think I chose it cuz I'm in Minnesota, Lizzo's from Minnesota.

Mirror, mirror on the wall, don't say it cuz I know I'm cute. Is cute in that sentence? It is. So as you'd expect, the first one, testStringOne, this returns false, right, because cute is not in that one. And that's what includes does, it's basically to see if one string is contained in the other.

But this other one here, Does. But you could also get kind of wonky results here, right? So let's say I had testStringThree, and this string could be execute. What am I gonna get if I put three here? True, right? Cute is right there. So that's gonna be true.

So that's gonna be if it's anywhere in the string. Or if later I come back and say the lazy cute dog, then all of them are true. So includes is a nice one, that's a relatively new one as well, makes it easy to see if something is contained in something else.

Another useful one is figuring out what the time is. So if you say, this function will give you back how many milliseconds have elapsed since January 1st, 1970. [LAUGH] People are probably wondering right now, why January 1, 1970? So this is called the Linux epoch, E-P-O-C-H. I don't actually really remember why they started measuring it, but at some point, they just started measuring dates in terms of how many seconds have elapsed since January 1st, 1970.

It's probably a Linux thing or a Unix. I'm gonna guess it's actually a Unix thing, which Linux is based on top of, cuz it's called the Unix epoch. But I mean, it's really easy to turn this number into a real date. So yeah, there's a bunch of functions that will tell you, you can translate that time into an actual date.

Yeah, most computer things are measured in this. For whatever reason, it's the unit of choice of measurement. Normally, it's actually seconds, not milliseconds, but JavaScript will actually give you back the milliseconds. So if you want, you just divide by 1,000 and you'll end up with how many seconds have elapsed since 1970.

And what's fun is, again, if I just keep doing this, you can see time is marching on, right? That's your life just wasting away watching Brian hit things on a keyboard. Just going, one step closer to death. Anyway, [LAUGH] you won't have any questions, it's dark in the afternoon.

>> I looked at that, but it's actually just arbitrary.
>> I assumed it was. They just had to measure time in some universally compatible way. And so now, everything does, all your servers, I guarantee your iPhone is measured that way, everything is measured in the Linux epoch.

Learn Straight from the Experts Who Shape the Modern Web

  • In-depth Courses
  • Industry Leading Experts
  • Learning Paths
  • Live Interactive Workshops
Get Unlimited Access Now