JSON Type Exercise

[00:00:00]
>> Let's attempt our first exercise. We're going to define a type that accepts any valid JSON value, and I've extracted the important bit out of the JSON specification. This describes what is allowed in JSON. So JSON value must be an object, array, number, or string, or one of these three literal names, false, true, or null.

[00:00:25]
This is a 100 percent of what's allowed in JSON. You don't see functions here. You don't see classes. Those are things that are allowed in JavaScript. You don't see undefined, for example, that is not a JSON concept. So you have some starting point code here. This is an important line to observe.

[00:00:43]
Everything below this line, you can think of as your test suite. These are a bunch of test cases to see if you have the following valid JSON things are valid down here. These are negative test cases, they should fail to compile. And we're getting yelled at here with ts-expect- error because it should fail to compile and it's not failing to compile right now.

[00:01:07]
So think of this almost like an inverse, like you need to make this throw or reject compiling not throw, but you need to make it, have a type error in order to make this test pass. So in the end, you want everything below this line all green, right?

[00:01:29]
Where you can see all of the things that should fail, will fail, and all of the things that should pass, pass. In terms of doing this, there are two ways you could do it. One is to click this try button, which will launch you into the TypeScript playground.

[00:01:44]
And this is a totally freestanding piece of code. You can see your red squiggles down here. You can code above this line to attempt this. Also, if you go into your workshop project, you'll notice we have chapter 8 in our notes. And then this gives you the exact same thing down here.

[00:02:03]
What you'll wanna do is just, all of these TS expect error things, oops, you'll want to do one level of uncommenting so they light up and yell at you, as they should, because right now there's no compile error and we want there to be a compile error. Please feel free to attempt this on your own.

[00:02:28]
Don't write any code below this line. You should just be defining these types here, and we'll see you and we'll walk through a solution. Let's go through the solution to the JSON types exercise. I'm gonna actually close this bottom terminal. We won't need it. All right, so let's try to solve this in pieces.

[00:02:57]
First, let's work with this JSONObject. And we might create a new type here as well. It's not necessarily gonna be the ones that sort of add up to this end thing, but we can call something a JSON primitive. And there we go. Copilot knows exactly what that means.

[00:03:23]
Maybe I'll just like solve this with copilot, where you just said JSONValue. That's a valid tool in the toolbox, but we'll talk through it anyway. So let's look at our checklist here. These are really the primitive JavaScript types that are possible in JSON. We've got string, we've got number, we've got Boolean, these two, and null.

[00:03:45]
All right, now, a JSONObject, we can say that that is, wow, that is using an index signature, and we can say for any key, there's a JSONValue. Now, we haven't defined what JSONValue is, but you can imagine, you could have a number here, or another object, or an array of objects.

[00:04:13]
So any valid JSONValue can be in one of these JSON objects. And in array, it's gonna be something very similar. It's just an array of JSONValues. And then what is a JSONValue in the end? Well, it's primitives, Or objects, or arrays. Let's check our tests. All the positive ones pass and no red squiggles for the failing ones.

[00:04:49]
So we could have avoided creating this type. If we wanted, we could have just done this, and it would have been perfectly fine. But I don't know, I kind of like the explicitness of this and it makes this last type very easy to think about. We can kind of think about the three different classes of JSONValues that we could have.

[00:05:12]
So this is a recursive type. Why? Well, object is defined in terms of JSONValue, which is defined in terms of object and the same is true with array. But it's all possible, and we can use this to define any kind of valid piece of JSON that we might have.