Promise

• Objects that help handle asynchronous operations in a synchronous-like manner

• One of resolve or reject must be called

• executor: executing a function that automatically runs when Promise created

• Constructor

    new Promise(executor);
  
    new Promise((resolve, reject) => {
        // code
    });
  

Promise State

• Pending

• Fulfilled: operation completed -> can proceed to next operation with .then(callback)

• Rejected: operation completed

---

Promise.then(callback)

• Becomes fulfilled state when resolve is called

• Moves to .then() when Promise is fulfilled

• Takes the argument from resolve(argument) as a parameter for the callback in .then()

    const resolvePromise = new Promise((resolve, reject) => {
      setTimeout(() => {
        console.log('First');
        resolve('Resolve!'); 
      }, 1000);
    });
  
    resolvePromise
        .then((data) => {
          console.log('Middle');
          console.log('Last');
          console.log(data);
        })
  
    // Print: First -> 1 sec later
    // Middle
    // Last
    // Resolve!
  

Promise.catch(callback)

• Becomes rejected state when reject is called

• Moves to .catch() when Promise is rejected

• Takes the argument from reject(argument) as a parameter for the callback in .catch()

    const errorPromise = new Promise((resolve, reject) => {
      setTimeout(() => {
          console.log('First');
            reject('Error!!'); // if we call reject explicitly, Promise regards the error occurred
        }, 1000);
    });
  
    errorPromise
        .then(() => {
            console.log('Middle');
            console.log('Last');
        })
        .catch((error) => {
            console.log(error);
        });
  
    // Print: 'Error!!'
  

Promise.resolve(value)

• A static method call the then() method passing argument: value, Promise, or 'thenable' to resolve

• When a Promise returns a value, the returned value is always wrapped in a Promise

    const firstPromise = Promise.resolve('First');
  
    firstPromise.then((value) => {
        console.log(value);
    });
  
    // Print: 'First'
  

• Can be used like Functional Programming

    const firstPromise = Promise.resolve('First');
  
    firstPromise.then(console.log);
  
    // Print: 'First'
  

    const countPromise = Promise.resolve(0);
  
    function increment(value) {
        return value + 1;
    }
  
    const resultPromise = countPromise.then(increment).then(increment).then(increment);
    resultPromise.then(console.log);
  
    // Print: 3
  

Promise.all(iterable)

• A static method takes an iterable of promises as input and returns a single Promise

• This returned promise fulfills when all of the input's promises fulfill (including when an empty iterable is passed), with an array of the fulfillment values

• It rejects when any of the input's promises rejects, with this first rejection reason

const promise1 = Promise.resolve(3);
const promise2 = 42;
const promise3 = new Promise((resolve, reject) => {
  setTimeout(resolve, 100, 'foo');
});

Promise.all([promise1, promise2, promise3]).then((values) => {
  console.log(values);
});
// Expected output: Array [3, 42, "foo"]

Promise.race(iterable)

• A static method takes an iterable of promises as input and returns a single Promise

• This returned promise settles (completed) with the eventual state of the first promise that settles

const promise1 = new Promise((resolve, reject) => {
  setTimeout(resolve, 500, 'one');
});

const promise2 = new Promise((resolve, reject) => {
  setTimeout(resolve, 100, 'two');
});

Promise.race([promise1, promise2]).then((value) => {
  console.log(value);
  // Both resolve, but promise2 is faster
});
// Expected output: "two"