We're going to go ahead and knock this out, and then we'll be done. That means we'll be calling getStatus with a userId. We're going to get the status back and we are going to log the status out:
getStatus(1).then((status) => {
console.log(status);
}).catch((e) => {
console.log(e);
});
Now to kick things off, what do we need to do? First up, we have to go ahead and return to keep the promise chain alive, because we attach the then and catch callbacks with the getStatus function.
Next up, we'll be calling getUser. Before we can actually use getGrades, we have to take the userId, find the user object, and get their schoolId. We also want to make sure to have access to the name for the message, so we need two pieces of information off of that object: getUser and userId. We'll add our then callback. In this callback, we're going to get access to that user object and this contains some useful information. One of those pieces of information is going to allow us to actually call getGrades. I'm going to return getGrades, right here, and we're going to pass in the student school ID, that's user.schoolId:
// Andrew has a 83% in the class
const getStatus = (userId) => {
return getUser(userId).then((tempUser) => {
return getGrades(user.schoolId);
})
};
So now that we have getGrades called, we'll have access to those grades next. The success callback for getGrades promise will get the grades array. We can then go ahead and actually create an average variable, which we'll do in a second, and then we can return our string. So, that is the goal for this function, but this is where we run into one of the first problems you most likely have seen when working with promises:
// Andrew has a 83% in the class
const getStatus = (userId) => {
return getUser(userId).then((tempUser) => {
return getGrades(user.schoolId);
}).then((grades) => {
// average
// return our string
});
};
We have the getStatus promise chain; we have to have one promise called in order to actually start the other one and, at the end of the day, I want to do something with values from both. Well, we can't; we do not have access to user inside the second then function. It was created in another function, the first then callback, which is a pretty common problem.
So, how do we solve this? There are a few ways we could do that. Most of them are kind of ugly workarounds. Just below the getStatus variable, I could make a variable called user and I would set it equal to undefined at first.
const getStatus = (userId) => {
var user;
Then, in the first then callback, I will give it a value when this function runs. Now, I can't have two variables with the same thing. If I try to type user = user, we're going to run into some problems:
const getStatus = (userId) => {
var user;
return getUser(userId).then((user) => {
user = user;
It is going to take the user value and set it equal to the user value in then callback. It's not going to use the user variable at all. So we have to add another little workaround: tempUser.
const getStatus = (userId) => {
var user;
return getUser(userId).then((tempUser) => {
user = tempUser;
Then we're going to go ahead and set user = tempUser, and this is going to technically work. We'll now have access to user variable and we can get some stuff done.