Check out a free preview of the full Getting Started with JavaScript, v2 course:
The "Primitive Types" Lesson is part of the full, Getting Started with JavaScript, v2 course featured in this preview video. Here's what you'd learn in this lesson:

Kyle introduces primitive types by debunking the myth that everything in JavaScript is an object and then explains what it means for the type to belong to the value in JavaScript instead of the variable. - https://static.frontendmasters.com/resources/2019-05-08-getting-into-javascript/getting-into-javascript.pdf

Get Free Access Now

Transcript from the "Primitive Types" Lesson

[00:00:02]
>> Kyle Simpson: Armed with a basic foundation in programming concepts, let's turn our attention to a look at the three pillars of JavaScript. The three main areas, units of discussion that you're really gonna wana spend time digging into. And again, as I said at the outset of this course, expectation wise, it's not like you can spend one day and be just totally done with any one of these three.

[00:00:25] These are weeks, months, potentially even years of time on each of them. And you're gonna get them in layers, you're not gonna have all of one and then all of another, it's gonna be layer upon layer. So as you go throughout your development career, and your JavaScript career in particular, you're gonna see these kinds of things coming up over and over and over again.

[00:00:43] And my hope is that you'll be able to take this as a reference to come back to. And again, the books as a reference to come back to, as you see those layers being added on as you go throughout your career. So the three pillars of JavaScript we wanna look at, number 1, we wanna look at types and coercion.

[00:01:00] Number 2, we wanna look at the scope and the closure system. And number 3, the this and the prototypes system. And actually, that's more about class oriented even than prototypes. So those are the three main areas that we will look at through the rest of this course. Let's dive into types and coercion.

[00:01:17] The three things that we wanna look at underneath types and coercion are the primitive types. And if you remember from the primer at the top, we saw primitive types like number and boolean and string. We wanna get real clear on what those are. We wanna talk about how you convert from one type to another, because basically all programs have to do some kind of conversion from one type to another.

[00:01:39] And then we wanna check whether or not two values are equal or one value's less than. We wanna do some sort of equality checking on our values. Those are the three main areas that we wanna pay attention to. And I'll just give you a word of caution, out of the three, this particular unit is generally speaking, one of the lesser focused on things as most people learn about JavaScript.

[00:02:02] And I think it might be one of the more important of the foundational pillars for this language. So it’s really important that you push against that normal temptation. Someone might tell you you don’t need to know about that stuff, just do it this way. I think it’s important to push against that and really dig in here and understand, these are core mechanisms to the language.

[00:02:21] And it's not gonna be effective for you in your career if you're writing JavaScript and you have no idea how it's working or what it's doing. So let's dive into types and coercion. We'll look at primitive types. Again, we said at the outset what those are, but just as a quick kind of review, we wanna look at the strings and booleans.

[00:02:44] And I wanna confront head on this statement that is thrown around this, you'll find this in books and blogs. And you may have run across this on a Stack Overflow answer or 500 at some point or another. Somebody will say something in JavaScript, everything is an object. That is thrown around as a fact and it is 100% false.

[00:03:05] It is not true in JavaScript everything is an object. There are historical reasons why people think that, but it really is not actually true. We do have, indeed primitive types. So let's look at what some of those are. You might recall that we talked about undefined. Well, we also have the string type, we have the number type, the boolean type, the object type.

[00:03:28] Those five are pretty solid, pretty well easy to understand, but we have a couple that might surprise you. So we have symbol, which was a brand new one that was added about two or three years ago. It doesn't get a lot of usage, but it is one of the primitive types in JavaScript.

[00:03:45] So every once in a while, you might run across a symbol. But what also about null? You remember undefined was an empty type, what about null? Well, that is a primitive type, but I have that highlighted in orange because it behaves a little bit strangely with respect to the type of operator.

[00:04:00] It gives us not back what we would expect, so it's an important type, but it has some quirks that we have to be aware of. And then also function, we know functions are a thing in our language but, is it really a primitive type? Technically it's not, it's actually technically just a subtype of the object type which is the same is true for arrays.

[00:04:20] Arrays are not their own official primitive type. They are a subtype of the object type. So let's just point out that the types that we're talking about are associated with the values themselves, not with the variables. So in some programming languages, like for example Java or C, you say variable x is gonna hold integers.

[00:04:43] And then it can only ever hold integers. And then you say variable y, and it can only ever hold boolean or something like that. Well it's different in scripting language, in a dynamically typed language like we have with JavaScript it's different. Because here we're not talking about x or y having a type, here we're talking about the values themselves having a type.

[00:05:07] So it's not the variables that have types, it's the values. So, when I say var v, you might recall when we declare a variable that it initially gets assigned the undefined value and the undefined value is going to have type of, quote undefined. If I assign it a string one, and then I say type of v, I'm gonna get quote string.

[00:05:28] And then if i assign it the number 2, and i say type of, it's quote number. And so on for boolean, we see the object giving us quote object,. There is one of those ES 6 symbols, giving us quote symbol. I wanna highlight the undefined for just a moment, because this one's a little bit bizarre.

[00:05:45] It's been declared and it's been given undefined but there's another case where we can get the same return result of quote undefined and that is when the variable has never been declared. You might think that should give a different result, I certainly do, but it turns out that in either the case where it's been declared and has no value or it’s never been declared.

[00:06:05] JavaScript sort of treats those both as the undefined state. And that can actually lead to some confusion later on so it’s good to be aware of that. Here’s an example, when we say type of doesn’t exist, there’s a variable that doesn’t exist, and yet we're still getting the quote undefined.

[00:06:21] We haven't created it with a var statement and yet we're still getting quote undefined. So again, be aware of the difference between a variable thats been created and has no value like v in the previous slide but also variables that you reference. And you don't often reference variables that are straight up, never exist, but you may be mistyped a variable name.

[00:06:43] And that will be in that state where the type of operator would give us quote undefined. I mentioned just a moment ago that null kind of behaves a little bit strange. We see here that type of v, when the value is null, we see that it gives us quote, object instead of what we might expect of quote null.

[00:06:59] This is an historical bug from JavaScript. There’s not really anything we can do about [LAUGH] those bugs. We can’t fix those things because it would break far too many pieces of code. And then we see if we assign it a function to the v variable, that's called a function expression, by the way, we'll talk about that later in the course.

[00:07:19] Type of v there, we get quote function and even though function is not an actual primitive type, it's a subtype of object as I said. It does have its own unique return value here which might be a little bit surprising but it's actually very useful because we need to know if we have a value that can be called as a function.

[00:07:38] And then we see line 9, we create an array, and typeof is gonna give us quote object here, because it can't further distinguish that as a subtype of the object there. You might think, why did it do it for functions and not for arrays? And the answer, as with most things, is because reasons, because history, there's a variety of different reasons.

[00:07:58] Why these works exist, can't really change them now because there's so much JavaScript that that would break. But again, we can further distinguish things that are raised using other built in methods, like for example, array.isarray. And we'll talk about about those sorts of operations as we go forward.