All language subtitles for 8. Optional Chaining

Let's now take a quick look at the very important optional chaining operator.

So remember how I said earlier that each book has this review field and it has reviews from this Goodreads

source and also from library anything?

And notice how each of them has a different reviews count.

And so in this lecture we will want to create a function that gives us the total reviews count for each

book.

So that's going to be basically this one plus this one.

Sounds very easy, right?

And that's because it is.

So let's quickly write a function that does that.

So let's say get.

Total.

Review count.

For a certain book.

So we pass in a certain book.

Let's just do that immediately, just so we see how we use this function.

But then, of course, our book here, it could be called Anything Else Just Be, for example, because

of course, this is simply the value that we are passing in.

So let's create one variable for each of these review counts.

So book dot reviews.

Thought good reads.

Dot review count.

And then the same thing for this library.

Anything.

Book dot reviews dot library anything dot reviews count.

And then we simply return one plus the other.

So good read should be good reads.

Plus.

And this one.

Now.

Okay.

Nice.

Now we need to lock this to the console, as always, to get our result, which is 812.

So that works beautifully for this book, number two.

But watch what happens when we use book number three.

So let's wait for it.

And actually the error pops up already up here.

And so then nothing else is evaluated.

So cannot read properties of undefined reading review count.

Well, let's just.

Take out all this code here.

And so then the error pops up down here.

So again, cannot read properties of undefined reading reviews count.

So what this means is that this particular book, number three here in the reviews doesn't have the

library anything.

So it only has good reads and therefore this here will get undefined.

And then we're trying to read reviews count out of undefined.

And so that's of course then not possible.

So again, the problem is that book reviews dot library anything right now is undefined.

So basically in JavaScript this part will then get replaced by undefined.

And then essentially we are reading undefined dot reviews count, which of course doesn't exist and

then it results in this error right here.

But fortunately for us, modern JavaScript has a solution for this which is called optional chaining.

And so with optional chaining we can basically ask JavaScript to only keep asking here for these next

properties in case that what comes before it actually exists.

So here, instead of trying to always read reviews, count out of this, we can just do it optionally.

Well, not like this, but like this.

So what happens now is that whenever this here is undefined, then JavaScript will no longer even try

to read reviews, count out of this.

And so this is why we call this optional chaining.

So the chain here only continues in case that this part here actually is not undefined or not null.

So what happens now is that all of this thing here is immediately undefined and therefore, here we

get this not a number.

So the result here is still wrong, but at least we're not getting an error anymore.

So right now it's not a number because this is some number and then we're adding undefined.

Which we can confirm like this.

Right.

And so yeah, we get not a number.

Therefore, here we now need to set a default value.

And this is why we learned about the knowledge coalescing.

Operator Because that one is actually perfect in this situation.

So in this case, we simply say zero.

So if there is nothing here, if there is no count for library anything, then it's just zero.

So then we're just adding zero to the value that we have from Goodreads.

And then we get our final result.

Okay.

So again, what's happening here is that because of this optional chaining, JavaScript will no longer

try to read reviews, count out of this undefined thing here.

So before we had undefined dot reviews count, which of course did not exist and gave us an error but

with optional chaining, as soon as this here is undefined the entire thing.

So all of this will automatically become undefined.

And so then we use this knowledge coalescing operator here to then simply give us zero instead of that

undefined right here.

Okay, so this is helpful whenever we are not sure that all the values that we expect exist in an object.

So before we had this here, we would have to first check if actually books, dot reviews, dot library,

anything exists and only then we could read reviews count out of that, which would really be a lot

of work because for example, let's say we're also not sure if even reviews dot library anything exists.

So it would be even safer to do this also here.

And why not also here?

Because there might be some situation where maybe the book has no Goodreads reviews, so let's simply

do this always.

At least always.

We are not sure about the data structure of the data we are receiving.