Hello, everybody. Here I go again, remember what we implemented in the last slide?
In the last slide we implemented a simple Promise. We implemented the simple flow and then methods inside the Promise and implemented asynchronous invocation of the Promise. But we also left some questions…
Since today’s code is based on what we implemented last time, you can read my last article if you are not familiar with it.
Implement a Promise library that complies with the PromiseA+ specification step by step
Problem 1: chain calls to the then method
As we all know, a Promise can be used to return a Promise again (or a normal value). And what’s more, the return Promise or the normal value that’s returned we need to get its value and pass it back to our next then method. Such as:
Of course we can also return a Promise in the then method;
So here’s the problem.
Question 2: What do we need to do if we return a Promise or a normal value in the then method?
So, get started.
Let’s tackle the first problem by making our then method chaining and accepting normal values.
This is a big pity. We will first revise the judgment of onfulfilled state in the then method, because the following is the same thing with him.
Let’s first look at Promise2 as defined. Why define such a variable?
We need to know if we’re going to implement a chain call of the THEN method in the Promise. When the first THEN runs and gives us the return value, we return that value.
So what do we have to ask? How can a value have a then method? So we’re going to wrap this value as a Promise object and return it.
So, we need to make each state return a Promise. That’s a bit much. So let’s test that out.
Let’s change the next two states.
Let’s get this straight. Pass the test.
We saw that the code ran for 2.496 seconds, and our test results were correct;
Here we have solved the then method chain call and returned a normal value in the THEN method to the success status of the next THEN method.
Now let’s tackle the second problem. We need to allow promises to be returned in the THEN method. So, we have to deal with that as well.
Let us try to do it
It’s very simple, we need a unified handler to do the processing that returns promises in THEN.
So let’s create a new method called resolvePromise
Said in the specification.
So if x and Promise2 point to the same object, we’re going to set the return of Promise2 to reject and return a type error. Look at the code below
Then we describe the details.
emmmmmmmm…
It’s a little bit of detail.
Ok, not funny, we’ve analyzed it very clearly in the code. Let’s get this straight.
In the THEN method, we can return a Promise, right? And then we get the result of the then method, which is either a Promise or a common value (x). And then we’re going to evaluate this x, and we’re going to evaluate whether this x is a Promise, right?
If it’s not, we can just return x, and if it is, we should know that promises always have then methods. We then need to determine whether the then method is a function. If not, we return the value of then, emmm… He should give an ordinary value.
If the then method is a function we can execute it directly. If the ondepressing is fulfilled, we will perform the key step, which is to recursively invoke our resolvePromise method to see if the parameter passed in our ondepressing is still a Promise. Until x or x. teng is a normal value, then we can return that value, resolve, our final value.
Of course we add try{}catch(){} again to avoid errors in the program.
Then we can replace resolve in our previous state determination with our resolvePromise method, for example:
Of course, the pending state below is the same.
At this point our Promise is pretty much fulfilled. But there’s another problem. Let’s consider the following code;
The code above uses the native Promise of ES6
What? We can see that there is nothing in the first THEN method, whereas our second THEN takes the resolve value of promies.
As we all know, the then method has ondepressing and onreject callbacks, so we’ll deal with these two callbacks.
Note that the default function in onRejected returns with throw. Because we’re going back to reject next time, we can handle both callbacks in the THEN method. Determine their type. If the type is function, it means that the two callbacks have something. Otherwise, we will return a default anonymous function whose parameter is the value returned by the Promise last time. That is, when we perform onfulfilled or onRejected again, we can get this value directly. And that’s what we’re looking for.
Now, we’ve basically implemented a fairly complete Promise. We implement asynchronous calls to Promise, return a Promise or value in then methods, and pass the result of an execution into the next THEN method without a callback.
Of course, we have a basic idea of how promises work, and then we can say that we can both use and implement a Promise.
Of course, there’s the small matter of not implementing a lot of promises. Such as:
Promise.resolve() . Promise.reject() .. Catch (), promise.all (), etc
In the next article, we’ll take a look at each of these approaches and walk you through the asynchronous evolution of these years of front-end development
The original callback->Promise->generator function -> our now common async await
All right, I think I’ll stop there. It’s not easy to see here. Thank you.
