Check out a free preview of the full Deep JavaScript Foundations, v3 course

The "Type Check Exercise Solution" Lesson is part of the full, Deep JavaScript Foundations, v3 course featured in this preview video. Here's what you'd learn in this lesson:

Kyle live codes the solution to the exercise.

Preview
Close

Transcript from the "Type Check Exercise Solution" Lesson

[00:00:00]
>> Kyle Simpson: So hopefully you feel pretty good about that exercise, hopefully it made sense. Let's dive in and try our hand at defining this object is polyfill. So number one, remember, we want an if statement that checks to see that Object.is has not been defined. Now, I'm gonna go ahead and use this little shorthand here, this Boolean coercion, I'm gonna say that the negate of Object.is.

[00:00:25]
So if Object.is has been defined, the only way that it ever gets defined is as a function. So it's definitely on the truthy list, and if I negate it, and if it's not there, it's definitely undefined. So to me, this is one of those places where I'm okay with the Boolean coercion because, hey, we're only checking either undefined versus totally present.

[00:00:48]
There's really nowhere in between. So we're saying if not Object.is, and I'm gonna throw in this or true for just now, just so we make sure that we're actually running our function. The first time I made this exercise, I made that mistake, and I couldn't figure out why things weren't working, [LAUGH] or why things were still working even when I had broken code.

[00:01:09]
So it's easy to make those mistakes. All right, so we're gonna define one, Object.is = function, and I'll just name it Object.is, if I could ever type. And it's gonna take two parameters, so I'll call it x and y. You could call it v1 and v2 if you feel better about that.

[00:01:30]
Again, the job of Object.is is essentially the triple equals, but also it needs to not lie in the cases of negative 0 and NaN. So there's a little bit of nuance here, which I happened to already know about, so I'll just jump to it. We wanna go ahead and get an indicator, a true false if you will, of whether x is a negative 0 and whether y is a negative 0.

[00:01:57]
So I'm gonna call it xNegZero; y negative zero, those are just gonna be variables that I assign to here in a moment. And what I'm gonna assign them is the result of testing a value for its negative zeroness. So I'm gonna define a little helper for myself to figure out if something is a negative 0.

[00:02:19]
I wonder if any of you were able to come up with a way of doing that without the built in object.is? Anyone?
>> Student: I stumbled across it a couple weeks ago accidentally.
>> Kyle Simpson: Okay, so you-
>> Student: So I cheated.
>> Kyle Simpson: You happened to have already seen it, okay, cool.

[00:02:35]
Well how would we do that? This one's a little tricky, so if you didn't get it, don't feel bad. But if you think about a value that is negative 0, what do we know about operations that we can do with 0? So if you say, take a negative 0, and you add a 0 to it?

[00:02:55]
Well, if you do that you know you're just gonna get a regular 0. If you take a negative 0 and you subtract a 0 from it nothing else is gonna happen, it's still gonna be a negative 0. So adding and subtracting aren't gonna help. But what about division?

[00:03:10]
We know that for example, 1 divided by 0 gives us infinity. What do you think one 1 by negative 0 would give us?
>> Student2: Negative infinity.
>> Kyle Simpson: Negative infinity. So there's a way of testing if we have a negative 0, the only way we could get negative infinity is if we had a negative 0.

[00:03:30]
Maybe not the only way but that's the way we're gonna do it. So I'm gonna say if NegZero take in a value, and I'm gonna say, first of all, we need to make sure it's one of the two 0 because if it was infinity, that would give us a false positive here.

[00:03:44]
So we'll say, if v is one of the two 0s, which we can either use the double equals or the triple equals. In this case, they would not have any distinction between the two. So if it's one of the two 0, and, and then we're gonna say (1/v) == -Infinity.

[00:04:11]
That's how we could know-
>> Student3: Was that a constant in JavaScript?
>> Kyle Simpson: Infinity is a built-in.
>> Student3: Really?
>> Kyle Simpson: Yep, it's a built-in identifier.
>> Student3: Okay.
>> Kyle Simpson: So 1 divided by v would give us negative infinity, if and only if v was negative 0. Again, the reason for this check is 1 divided by negative infinity, would also give negative infinity.

[00:04:32]
[LAUGH] So, we don't wanna have any false positives here. Okay, so that's how we're going to check if x and y are negative 0s, we're gonna call that little utility. So we'll say, if isItNegZero(x), and then we'll say if isItNegZero(y). Now, the first thing we wanna do is if either x or y is a negative 0 then we're gonna check if both of them are.

[00:05:05]
But we need to first check if we're dealing with the case that either one of them is the negative 0. Because if either one of them is negative 0, we know that the triple equals is gonna lie, so we can't allow that to occur. So we're gonna say, if (xNegZero or yNegZero), that's gonna be one of our conditions, and we'll handle what to do with that.

[00:05:27]
Now, if that's not the case, the next thing that we need to check is if both the x and the y are NaNs. Everybody with me? If both of them are NaNs, then we wanna return true, because we know that's the case where triple equals would return a false false, if you will, it would lie and say false.

[00:05:50]
So we need another utility for checking for NaNs. You could just use number.isNaN, but the README suggested maybe try your hand to coming up with it. Did anyone come up with a way of testing for testing for NaN without the built-in utilities? Did you also see that one [LAUGH] a couple of weeks ago?

[00:06:09]
Okay, what did you come up with?
>> Student: It's kinda jenky.
>> Kyle Simpson: What is it?
>> Student: But it's an if that checks if param1 is not equal to param1 or param2 is not equal to param2.
>> Kyle Simpson: Okay.
>> Student: And then inside there returns type of param1 is number and type of param2 is number, then they're the only numbers that are not equal to themselves-

[00:06:34]
>> Kyle Simpson: Okay.
>> Student: [CROSSTALK] NaNs.
>> Kyle Simpson: You're on the right track. I think we can even do this simpler, you're on the right track. The specific trick here is that NaN is the only value in existence in JavaScript that's not equal to itself. So if I pass in a NaN, it will be not equal to itself and everything else that would fail.

[00:06:51]
So we can simply say, v not equal to itself.
>> Kyle Simpson: And NaN is the only one that would return true from there. So I'm going to test, if (isItNaN(x) && isItNaN(y)). And if that's the case, we definitely know return true, cuz they're both NaNs, and this is the case where we wanna tell the truth.

[00:07:22]
And if neither one of those too is the case then really all we need to do is to further the triple equals. So we simply return x === y;.
>> Kyle Simpson: So let's handle this particular case up here. If one or both of them we're not sure yet, but we know at least one of them is a negative 0.

[00:07:44]
Then how do we know if we should return true or not? Well, only if both of them are negative 0. So we can simply say here return xNegZero && yNegZero;.
>> Kyle Simpson: So the little pre-optimization that I already knew about was that I was gonna need to check it twice so I went ahead and cashed it into a variable instead of checking it twice with the function call.

[00:08:18]
>> Kyle Simpson: Double checking against the solution file, as you see over here, and I've written it almost the same. I'm gonna just take this code that I just wrote here,
>> Kyle Simpson: And I have a little environment. This program's called Run JS, which is like a console that executes stuff, it's not perfect but it's pretty good.

[00:08:44]
So I'm gonna drop this code into here and run it. And we should see all trues and we do.

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