You might get another difficult task of mapping data with promises, as you can see here, we have such
feature.
You have two functions which returned premises mobile data from users and user statuses to get array
of users with a name and detective.
And as you can see here, we have 130 users with ID and name.
And we have a secondary user statuses with ITI and executive properties.
And actually, this is exactly the same like here, and this is exactly the data that we need to map.
So we need to get an array with the ID name and is active.
But the main point is that this data are not available for us.
They are only available here inside, get users and get user statuses.
So we have two functions which are promises, and typically you will fetch this data from the EPA.
This is a way to get.
Users will return for a promise.
This is why we are resolving an array of phone users here and here.
The same with user statuses, which actually means we have to promise we must resolve them and combine.
And there are different ways how we can solve this task.
The most beginner approach here is to fetch first promise and then the next one.
Let's try this now so we can right here get users.
And this gives us back a promise.
This is where here we can right then and we're getting our users back now.
After this, we want to fetch our get user statuses so he'll work, call and get user statuses.
And we'll also use them here and we're getting back our user statuses.
And now inside this function, we have access to user statuses and users.
Because here we will get only after resolving both of them, but not in parallel, but one by one.
And what we can do here, we can map users so we can create, for example, mapped users, and we need
to look through our users with map.
We have access to every single user and now we need to find this is active property because this is
exactly what we want to put in our array.
This is why here we can write Konst is active.
And here we want to find inside user statuses our status.
This is where shall we write and find user status?
And here we need to check user status.
Dot I.D. equals our user I.D..
But this will return fast user status and we must, right at the end, is active.
In this case, we will get on this specific property.
Now, after we got our executive, we want to put it inside every single object.
But we won't use here.
Push because you remember Bush's bet.
This is why we will simply retention.
You object and we are spreading here.
All fields of our user class is active property in this case, where Putin is active property in every
single use.
And after this, we can just console look our map to users here, and they are available for us inside
our application.
Let's check the salt overload in the page and we're getting our matthewson.
And as you can see, this is in array with three objects I name and detective, which actually means
we successfully solved this task.
But there are quite a lot of problems in this code.
First of all, we have two different premises and they are not dependent on each other, which means
it doesn't make any sense to wait for first premise and only then make a second premise.
We actually must do them in parallel.
In either case, it is too slow.
So I want to write here that this is solution one and they want to comment.
Our a solution.
Now let's try the second solution, and for the second solution, we can use promise.
Oh, if you don't know what this premise.
So this is exactly what is helping us to do several promises in parallel.
We can right here promise dot all and we must pass array of premises in sight.
So here we have an array and we can right here get users and then karma get user statuses.
In this case, we're throwing inside premise solar array with our two premises and after promise at
the end we can just right then and here we will get our result as in the rate, but it's not very comfortable
to work with the REIKIA here.
This is why we can directly the structure here, our array to our two properties.
And here we are, getting our users in.
Here we are getting our user statuses.
And after this, we can do our logic, which we did here with Matthewson.
This is why I will cook this code with Mat users and just put it inside here because it will stay exactly
the same.
So here we have access to our user and our user statuses, and we're mapping them and console.log in
it here.
Let's check this out.
I am reloading the page and will get in exactly the same response back.
The main point is here.
We just promise all, and this is much better because in this case, we're making this request in parallel.
Also, as you can see, the solution to we don't have this bad Neston was then and then, and here we
have just a single then.
And this is obviously better because we want to avoid this deeply nested code, but we can make this
code even better.
As you can see, we have this map to users and we actually can remove this code outside of our then
just to make it more readable.
So here we can create additional function before, for example, map users and we know that we're getting
here, our users end user statuses.
And actually, this is completely pure function, which will just map our users so I can card this code
and put it here inside.
And here we don't need our const.
We can directly return our map.
And actually, this code will be exactly the same like we used it previously.
And now what we can do here, we can just create mapped users and here were sign in map users and we're
passing inside our users and user statuses.
And as you can see now, this code is even better to read because here we have simpler premise.
So then we're mapping our users with additional function and work on slug in them.
Let's check this out.
As you can see, we have exactly the same response and actually we can improve this function even a
little bit more, as you can see where mapping users inside.
What then?
But actually, we can chain our fence, which actually means here may be woven directly to return our
map to users.
So our first then we'll just map the users and return them here.
And after this, we can write one more then and here we will have our mapped users.
And here we want to work with them.
So here I will.
Console.log our mapped users in this case were split two different then mapping of the users and working
with success.
And actually here with simpler console.log our users, which means this is our success and we can even
remove a return from here and ride this as a single lane.
In this case, it will be even more readable.
So I would say that this code is as dry as possible.
This is why if you want to show that you are an advanced developer, you must write your code and try
to improve it as many times as possible.