We're going to talk about the sink.

Await feature in Java script.

First off, all will go through a brief history off chasing programming in Java script.

We'll see how it evolves over time.

We'll quickly take a look at the callbacks, promises generators and finally a sink away.

So let's get started.

Okay, so I already mentioned this, but this is history facing programming, jobs stripped.

So it all started back with callbacks in the past, and then we were able to use promises, which was a major like shift from callbacks.

And then we were also able to its generators.

Now I didn't use generators much, pretty much like skipped over them.

So I went straight from promises to a single weight.

But generators are in between those two stages and finally, like, right now in the present time, we have access to these honestly, like amazing feature that is called a sink away.

So what they want to do next is that we want to present to you a piece of code, and then I want to show you the same piece of code in C callbacks, promises and a thinking the way for the generators.

I honestly wouldn't want to show that because I personally don't you have a lot of experience using generators side.

I don't want to show you something.

Dates.

Maybe I badly written.

So I'm going to skip over the generators.

So let me show you that.

And here it is.

So this is the callback exam.

Now.

I really didn't want to create, like, the most complex callback example ever.

But trust me that, like the seasons, the worse that you can see.

Um, he didn't get much, much, much more uglier than thesis right now.

So what we have here is a function date is supposed toe be and end point Chandler.

So, for example, let's say you were building some sort of a website, and the scandal over here will receive requests from the client, for example, the brows are sending requests to the server, and this response object is what you can use to actually write back something to the client.

For example, tow the user browsing your websites.

So now what we have in this example is we're talking with the database and let's say we have a table or a collection for user's, and we want to find a particular user that will be sent to us via this request.

So we want to call this function user that find by i d.

And simply best This requires the user i d property.

But now dysfunction is facing one.

We don't know how many milliseconds it is going to actually run for, so we need to do this in a sink manner because otherwise we're going to block the coat.

And given the Java script is single chided language that wouldn't really work.

So now we call this function and what we do then is we actually pass it as a second argument, a totally different function that will get called once these operation finishes.

So we say here like, Okay, you go on database and try to find me this particular user.

And when you do that, then and only then you call dysfunction that we passed over here and pretty much like everything starting at these lying over here and ending over here is the function that we passed two.

That's function over there.

Now what?

This allows us to do it say after these same the next line over here, we can maybe do something.

The consul, that log and whatever we do inside that kinds of that log, once this entire court gets executed will be printed out before we see any of this, because this season done instantaneously.

But anyway, you can see how it looks like and when you pass a callback function so dysfunctional here is called the callback function.

That's the reason why this pattern of programming is called callbacks, after all.

And when you provide a callback function, you should always provide error as the first argument.

So then we can easily check if there is an error by first doing that and the only if there is no error, then we can move on and do something else.

So in this example, if there were any errors, we would simply respond back to the clients pretty much for reading that error to the clients.

Now you see that we have these other argument called user, and what's going to happen is dysfunction over here used that find my i D.

In case they're no errors and in case it is able to find that particular user, it will send that user to this callback function, and it will be stored in thes variable called news.

So now we have access to this user in this callback function from here to here by referencing this user variable.

So now what we want to do is that user variable is going to hear property called tasks i d.

And pretty matching the same man there.

Let's say that we want to get access to those tasks so we again, like, query the database for those tasks given by that I.

D.

So we do pretty much the same thing.

And then again, we supply the callback function again with, uh, error is the first argument and not tasks as a second argument.

And then we again simple check.

And if there were any errors, we simply want to respond back to the plant with those errors.

And if that wasn't the case, we're going to do something with those tasks instead.

So what would want to do is, for example, like imagined that tasks he had a property called completed.

That is a bullion type, and we simply want to change that to be true.

So now, once we so now, once we actually modify it that role or documents in our database.

We don't want to save those tasks and saving the tasks.

He's again Ace Inc because it is not done instantaneously.

So we again need to provide a callback function to it.

And this time we don't want to seem to re to receive any return value for meeting said.

We just want to make sure that that operation was successful.

So then we simply check whether the Arab was there.

And if so, we again respond to the client with such are.

But otherwise we simply respond back to the clients with the message of task completed.

Okay, so hopefully like this will make sense and you're able to understand, like the flow.

And you're also able to understand, like, why is there a need for the school back functions?

And now let's take a look how all of these, like the exact same court issue handled when it comes to the promises and this is a promise, is example, and one thing you can spot straight away easily how, how much clear and cleaner this could actually is.

So this time, what we're doing, he's given that user that find by ideas again the same function.

And it is again a sink function.

We simply call it, and we pass what their argument we actually want.

But then, instead of supplying a callback function to these line over here, what we don't do is we take on the dot then function, and then there we actually supply.

You can think ofit like callback function.

What will happen once these operation is completed So it can pretty much traded like dislike user that find by idea capacities, idyllic started this process and then once it's actually completed, only then do you do whatever the code is over here.

So when that's done, we can then get a handle on that, use their subject, and then we can do something.

Now, here, we're going to start another racing function.

Cool tasks that find by i d.

So we pretty much just return that, and then what happens is we can just attach on like another, then to this piece over here.

And then this part over here will only get executed once this Ace Inc inside of here is actually completed.

And now in the same manner we can do these lines of codes over here and then task that safe is yet another facing cooperation.

So we want to return that as well.

And then we supply another function that should be executed once this is done.

And now we don't need any parameters here, so we just respond back.

The client saying Task completed.

Now you might be surprised how we didn't do any era Hell link so far.

So what's going on is using promises you can actually call dot catch at the end, which we'll catchall there's for you and then we simply want to respond back to the client with such Harris, if that was the case, So, as you can see, it's much clear because one error handling doesn't need to happen all the time.

We can just like you have, ah, specialised piece of code that is going to handle errors no matter where they actually happened.

And to, um, as you can see, we don't you have that nesting better.

That gets really hard to read.

That is called a callback hell and sometimes it is referred toe Christmas tree shaped because, as you can see, it goes kind of like these and then the opposite.

So it is definitely like a much neater way to write facing coding job script.

Now let's take a look at the same example using the sink.

Wait, and here it is.

As you can see, it's much, much, much, much more clear than what being able to see previously.

It almost looks like a sink and blocking coat, but fortunately it isn't so.

What's going on here is whenever you want to write a sink, await function, you need to write this key words.

They think before the function keywords.

And once you do that, you actually have ability to use these away.

Two key words inside of that function that is declared to be a racing function they think await is actually all promises under the hood.

So, like if you really want to get ah deep and detailed understanding off a sink await feature, it's best if you learn promises first.

But I'll do my best at least explain you what's going on over here.

So first thing you can notice is we have this try catch construct, and that is how you're able to handle errors in a sink, awaits functions So the sketch piece over here is similar to the catch beasts we have seen over at the promises Example.

We do all of our era handling inside of here and inside of our try block over here.

What we do is next we call this user that find my I d.

And again we passed parameters that we wanted.

But now we actually, uh, right this a way to key word in front of it which will actually tell this function that this operation over here is It's Inc and it's not going to happen instantaneously.

So these pretty much ah awaits this function to be resolved, and then each stores the result of feet in the variable that we assign and left.

And now this next line tasks equals await us would find by a D will only execute after the user equals of 80 residents find by a d gets resolved So you can almost, like, read it like a sink blocking quote.

So next we wait for the tasks and then we supply this user the tasks i d.

As an argument.

And then we get those tasks and then we can simple, like task that completely equal strolling modified the tasks and we can also save the tasks.

And you can see because all these three operations are you think we need to put this away to keyword in front, and then we can simply responds that send to the client back message saying that's completed now.

If error happened during any of those three operations, the execution flow will jump straight to the sketch block over here, and it will respond back to the client with such error.

So I hope that now you can appreciate the abilities that I think a great feature actually gives us as we do our daily Java script chasing programming.

So what I want to do next is I don't want to stop here, but instead I want to go with you through a bunch of a think await examples win, which I could show you the sequential flow barrel flow.

I also want to show you like all the loops and deterioration that you can do with a sink.

A Wait, I'm going to show you some common gorgeous that you might be unaware off at this moment.

And all in all, I just want to let go through it, A bunch of examples.

So did you feel confidence in your ability to start using this A sink away feature today?

Okay, so now let's do like a bunch of examples so that you can see all the ins and outs off using a sink awaiting your code.

So what I've done is I've made, like three different folders who were here.

First we have a sequential, then we can parallel and then we have lips.

So those are three topics that we want to go through and in each of the lease topics we have, like for the sequential, we have, like a naive approach.

Then I'm going to demonstrate like an issue that happens with it.

And then I'll also proposed a solution.

And that's the same with parallel and then for the Lopes.

I'm just going to let go over like the different types of situations that you can go with using a sink away and explain, like what you can do and what you can to do.

So let's get started with the Sequential project example and let's go in this name approach.

So we have two files that we care about.

We have a major address and we have a process that Jess.

So if open main just filed you see this?

We simply get a handle on those two processes that we actually have inside that process filed.

And the whole idea about this small project is it We have to process data a think, and that we want round them sequentially.

So now, like in the example that I've shown you in the slides, we have this function main that gets cold over here.

And then we attach these ace inky words in front of these function key words.

And then we do all sort of things inside of here.

So what we do is we await for those two processes.

And then what we want to do is we want to store their values in these two variables over here and then simply when all of this is done, we wantto use the consulate log to actually print out to the terminal the value states we got from those two processes and then these consulate log is simply for like, for mating purposes.

And we also call these consulate time and causality.

Time and functions which will tell us how long?

Uh, the function has been running for in milliseconds.

And if there any errors, we simply consulate.

Error them again to our terminal over here.

So now let's take a look in this process of Js file and see what's in there.

So over here we just eat export to functions that they're also a think ones.

And in them we simply coward put it process has started.

We again used time in time ends toe show to the terminal how long this particular function has been running for and likewise for the 2nd 1 And then we we kind of fake these operation by simply waiting 5000 milliseconds.