Just when you thought it was safe to go back in the water the swim with the promises, I don't know
Anyway, I I do want to add something to this list here. You're watching this
So there's another video here. So I want to talk just really quickly and show you one thing about try and catch
so if you remember where I left off with promise all what I had is
I have this particular and I kind of made some modifications in between the last video and this one but I have this particular
JavaScript program using the p5.js library that makes a bunch of calls to wordnik and the giphy API and
When everything is done, and it's finished with all those calls, they're all promises I get back
Some results and I place them all in the DOM with a paragraph element in the image elements now
The problem here and again promises at all promise not all is not necessarily the best solution for this anyway
but since I'm demonstrating it the main issue here is
If any of those it's all or nothing if any single one of those has an error like there isn't a gif associated with that word
Available in the giphy API the whole thing doesn't do it. It doesn't do anything
So just about every time I run this I'm not getting anything now
Let me just make it work by let me just let me just get like
Three of them and let me just say they're all gonna be three letter words
I think this will probably work right so I got three gifts with three 3-letter words so you can see that that worked
But what I want is I want to I want it to work anyway
And I want to see a 2-letter word a 3-letter word four or five six seven and so let's do that
Oh, whoa, it actually worked so that was the first time that worked
but most of the time we're going to get an error so
There's a way around this and it is not a way around this but there's another concept that could help here. That's important
Which is try and catch so a place that I could use try
what I want to do is individually handle error messages differently and a way that I can do that here is
Is by I can I can handle the error message myself and not cause it to fail by using a try-catch here
So the first thing I'm gonna do is I'm actually just gonna say let image
URL equal null so I'm gonna assume that I'm starting with the idea that there isn't an image URL then I'm
going to try
to get the image URL
From
from
the
Sorry, try to get the image URL. I'm getting sleepy after making all these videos
I'm gonna try to get the image URL from the data now it might not exist. That's fine. I'm just gonna try
Then I'm gonna return
JSON one word and image URL now this will be no if this doesn't work so I can now go up. Oops
I can go back up in my code and I could say hey
If results index, I dot image equals null
You know as long as it's not no do this
So this now should let everything keep going and will only just skip making an image where there wasn't one. Let's see if that works
Okay, ah all right so fine I was thinking I could demonstrate this without a catch and then show you the catch
Next I thought there might be like a default catch. But clearly there's not that makes sense, right?
So and there's a finally thing too off to come back to that another time, but what it's saying is like hey
Hey, if you're gonna try something you I can try it
But you got to tell me what to do if things go wrong like I
You're in charge now, like the the error isn't just going to be handled however it's going to be handled
So I need to actually say catch and the catch
Actually gets inside of here. It's like a function. It's not an argument and I could call that error
So I'm actually gonna catch that error. I'm gonna say console.log
no image found for
JSON oops for a json1.word
And
Then I'm also going to just say console.error
I'm as well as print out that error as well and let's just call it e-r-r are just so we have things named differently
So I think this is right now now what I'm doing is I'm saying hey
let me uh
Try to grab the image URL if it doesn't exist
Just spit something out to the console and but keep going. So, let's see if this works now
Whoa
Right. It didn't find it for any of them weird
Okay, so I got a mistake somewhere because it only didn't find it for one of them
I think I'm I've got something wrong somewhere Oh Oh
What did I do here? If yeah, if this is like total nonsense, this is what I need to eat lunch people
I should not be making this video tutorial right now
That was total nonsense what I wrote before what I'm saying is as long as the results image is not null
Not not the image equal to no that makes no sense at all. Let's try that again
Great now, they all unfortunately, they all worked
But you can see now work, but no image found for fueler and we should see that fueler is still here
But just no image is associated with it
so no image found for fueler no image transfer whatever that word is and so now
This goes through but I can sort of see what are the things where it doesn't work
Okay, so I have talked to you about now. I added this last little bit
about try and catch
weird edit point, I'm getting some interesting feedback on the chat that's things like people use try catch too much and that
try catch is useful, but it should be used as a last resort if all your other stuff fails, so I again
I'm not necessarily suggesting
That the way that I've done this is the optimal way to create this word gift generator
I mean ultimately if I wanted to do that
I'd probably want to not just like have a hundred promises that all happen all at once
I'd want to animate and sequence and make things interactive and maybe I type in a word all sorts of possibilities
But I'm trying to show you the bits and pieces and features. So the important thing here I think is that you can write an
asynchronous function that returns a promise without ever saying promise by using the await keyword and the async keyword
You can use promise.all
to
Execute some code when a whole lot of promises are finished and the results will always come in, in the same order as the array
and
But you can also sequence processing promises with .then, .then, .then. Nothing
Ok, so there's some other things that I should do like I should use enhanced
Object literals which is like an es6 feature. Maybe I'll come back and talk about that in a video that's thing with the strings
What's the thing with the string strings?
es6 literals
There's like a thing template literals. I should use that
So so somebody remind me in another video
I'll talk about some other es6 features like template literals and
Enhanced object literals now, just go look up those things on your own little tidbits here. Good-bye.