JavaScript special algorithm problem (6): Promises

@Bubbling Horse Tree

The original address of the question bank: http://csbin.io/promises

Promises

Challenge 1

question:

Let's start by reviewing async functions! Using setTimeout, print the string "Hello!" after 1000ms.

answer:

 // Challenge 1

function sayHello() {
  // ADD CODE HERE
  setTimeout(() => console.log('Hello!'), 1000)
}

// Uncomment the line below when ready
sayHello(); // should log "Hello" after 1000ms

Challenge 2

question:

Create a promise. After a delay of 1000ms, pass in the value "Resolved!" in resolve, and use setTimeout. After the promise is called resolve, print its content, which is achieved by passing console.log to .then.

answer:

 // Challenge 2
var promise = new Promise(function (resolve, reject) {
  // ADD CODE HERE
  setTimeout(() => resolve('Resolved'), 1000)
});

// Should print out "Resolved!"
// ADD CODE HERE
promise.then(res => console.log(res))

Challenge 3

question:

Create another promise. This time, setTimeout is not used, and the value "Rejected!" is passed in the reject. After the promise is called reject, print its content, which is achieved by passing console.log to .catch.

answer:

 // Challenge 3

promise = new Promise(function(resolve, reject) {
  // ADD CODE HERE
  reject('Rejected')
})

// Should print out "Reject!"
// ADD CODE HERE
promise.catch(res => console.log(res))

Challenge 4

question:

Promises are asynchronous. Now let's prove that they do! Create a promise, pass in the value "Promise has been resolved!" in resolve, and uncomment the bottom of Challenge 4. What is the print order we see after running it? "Promise has been resolved!" or "I'm not the promise!" first? Why?

answer:

 // Challenge 4

promise = new Promise(function (resolve, reject) {
  // ADD CODE HERE
  resolve()
});

// Uncomment the lines below when ready
promise.then(() => console.log('Promise has been resolved!'));
console.log("I'm not the promise!");

Challenge 5

question:

Write a delay function that returns a promise. This return promise should return a setTimeout that calls resolve after 1000ms.

answer:

 // Challenge 5
function delay(){
    return new Promise(function (resolve, reject) {
        return setTimeout(resolve, 1000)
  })
}

// Uncomment the code below to test
// This code should log "Hello" after 1000ms
delay().then(sayHello);

Challenge 6

question:

In this challenge we will use .then to chain promises. Create two variables: firstPromise and secondPromise, let secondPromise be a promise that passes the value "Second!" in resolve, and firstPromise passes secondPromise in resolve. Call firstPromise with .then, which will return secondPromise, and then print the content of the corresponding promise after its resolve is executed, which is achieved by passing console.log to .then.

answer:

 // Challenge 6
//
// ADD CODE BELOW
var secondPromise = Promise.resolve('Second!')
var firstPromise = new Promise(function (resolve, reject) {
  resolve(secondPromise)
})
firstPromise.then().then(res => console.log(res))

Challenge 7

question:

We have an API that pulls data from a database, it takes a subscript parameter and returns a promise. Your challenge is to use promise.all to make 3 API calls and then return the corresponding data when all calls are complete.

answer:

 // Challenge 7
const fakePeople = [
  { name: 'Rudolph', hasPets: false, currentTemp: 98.6 },
  { name: 'Zebulon', hasPets: true, currentTemp: 22.6 },
  { name: 'Harold', hasPets: true, currentTemp: 98.3 },
]

const fakeAPICall = (i) => {
  const returnTime = Math.floor(Math.random() * 1000);
  return new Promise((resolve, reject) => {
    if (i >= 0 && i < fakePeople.length) {
      setTimeout(() => resolve(fakePeople[i]), returnTime);
    } else {
      reject({ message: "index out of range" });
    }
  });
};

function getAllData() {
  // CODE GOES HERE
  return Promise.all([fakeAPICall(0), fakeAPICall(1), fakeAPICall(2)])
}

getAllData().then(res => console.log(res))

---