Search code examples
javascriptes6-promiseasynchronous-javascript

How do I consume this second promise?


Here's the code

console.log("Before");
const p = getUser(1);
p.then(user => {
  console.log(user);
  getRepositories(user.github);
}).then(repos => {
  console.log(repos);
});

console.log("after");

function getUser(id) {
  return new Promise(function(resolve, reject) {
    setTimeout(() => {
      console.log("Calling a database " + id);
      resolve({ id: id, github: "Zain" });
    }, 2000);
  });
}

function getRepositories(username) {
  return new Promise(function(resolve, reject) {
    setTimeout(() => {
      console.log(`Calling Api for ${username}`);
      resolve(["repo1", "repo2", "repo3"]);
    }, 2000);
  });
}

I'm having trouble with consuming the promise returned by getRepositories() function. Above is my implementation but it doesn't work and returns undefined (instead of the array [repo1, repo2, repo3]).

Here's the output:
enter image description here

I want the array to return after logging "Calling Api for Zain" but the undefined is shown before it, but I don't know why, so I need help regarding this.


Solution

  • You need a return statement in your first .then:

    p.then(user => {
      console.log(user);
      return getRepositories(user.github);
    }).then(repos => {
      console.log(repos);
    });