Detailed explanation of JavaScript Promise and Async/Await

new Promise(function(resolve, reject) {
    if (/* asynchronous operation successful*/) {
        resolve(value); //Change the state of Promise from padding to fulfilled
    } else {
        reject(error); //Change the state of Promise from padding to rejected
    }
})
There are three prototype methods in the implementation: then, catch, and finally
promise
.then((result) => {
    //promise is accepted or rejected to continue execution})
.catch((error) => {
    //promise is rejected})
.finally (() => {
    //When promise is fulfilled, it will be executed anyway})

const onMyBirthday = (isKayoSick) => {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      if (!isKayoSick) {
        resolve(2);
      } else {
        reject(new Error("I am sad"));
      }
    }, 2000);
  });
};

onMyBirthday(false)
  .then((result) => {
    console.log(`I have ${result} cakes`); // console prints "I have 2 cakes" 
  })
  .catch((error) => {
    console.log(error); // not executed})
  .finally(() => {
    console.log("Party"); // The console prints "Party"
  });

onMyBirthday(true)
  .then((result) => {
    console.log(`I have ${result} cakes`); // not executed})
  .catch((error) => {
    console.log(error); // The console prints "I'm sad"
  })
  .finally(() => {
    console.log("Party"); // The console prints "Party"
  });

const enterNumber = () => {
  return new Promise((resolve, reject) => {
    // Start coding here });
};

const enterNumber = () => {
  return new Promise((resolve, reject) => {
    const userNumber = Number(window.prompt("Enter a number (1 - 6):")); // Ask the user for a number const randomNumber = Math.floor(Math.random() * 6 + 1); // Pick a random number from 1 to 6 });
};

const enterNumber = () => {
  return new Promise((resolve, reject) => {
    const userNumber = Number(window.prompt("Enter a number (1 - 6):")); // Ask the user for a number const randomNumber = Math.floor(Math.random() * 6 + 1); // Choose a random number from 1 to 6 if (isNaN(userNumber)) {
      reject(new Error("Wrong Input Type")); // When the value entered by the user is not a number, an exception is thrown and the reject function is called}
  });
};

return new Promise((resolve, reject) => {
  const userNumber = Number(window.prompt("Enter a number (1 - 6):")); // Ask the user for a number const randomNumber = Math.floor(Math.random() * 6 + 1); // Pick a random number from 1 to 6 if (isNaN(userNumber)) {
    reject(new Error("Wrong Input Type")); // When the value entered by the user is not a number, an exception is thrown and the reject function is called}
 
  if (userNumber === randomNumber) {
    // If they are equal, we give the user 2 points resolve({
      points: 2,
      randomNumber,
    });
  } else if (
    userNumber === randomNumber - 1 ||
    userNumber === randomNumber + 1
  ) {
    // If the difference between userNumber and randomNumber is 1, then we give the user 1 point resolve({
      points: 1,
      randomNumber,
    });
  } else {
    // Otherwise the user gets 0 points resolve({
      points: 0,
      randomNumber,
    });
  }
});

const continueGame = () => {
  return new Promise((resolve) => {
    if (window.confirm("Do you want to continue?")) { // Ask the user if they want to continue the game resolve(true);
    } else {
      resolve(false);
    }
  });
};

const handleGuess = () => {
  enterNumber() // Returns a Promise object.then((result) => {
      alert(`Dice: ${result.randomNumber}: you got ${result.points} points`); // When resolve runs, we get the user's score and the random number // Ask the user if they want to continue the game continueGame().then((result) => {
        if (result) {
          handleGuess(); // If yes, game continues } else {
          alert("Game ends"); // If no, pop up the game end box}
      });
    })
    .catch((error) => alert(error));
};
 
handleGuess(); // Execute handleGuess function

const handleGuess = async () => {
  try {
    const result = await enterNumber(); // Instead of the then method, we just need to put await before promise to get the result directly alert(`Dice: ${result.randomNumber}: you got ${result.points} points`);
 
    const isContinuing = await continueGame();
 
    if (isContinuing) {
      handleGuess();
    } else {
      alert("Game ends");
    }
  } catch (error) { // The catch method can be replaced by try, catch function alert(error);
  }
};

const enterNumber = () => {
  return new Promise((resolve, reject) => {
    const userNumber = Number(window.prompt("Enter a number (1 - 6):")); // Ask the user for a number const randomNumber = Math.floor(Math.random() * 6 + 1); // The system randomly selects a number from 1 to 6 if (isNaN(userNumber)) {
      reject(new Error("Wrong Input Type")); // Throws an error if the user inputs a non-digit number}
 
    if (userNumber === randomNumber) { // If the user guesses the number correctly, give the user 2 points resolve({
        points: 2,
        randomNumber,
      });
    } else if (
      userNumber === randomNumber - 1 ||
      userNumber === randomNumber + 1
    ) { // If userNumber differs from randomNumber by 1, we give the user 1 point resolve({
        points: 1,
        randomNumber,
      });
    } else { // Incorrect, score 0 resolve({
        points: 0,
        randomNumber,
      });
    }
  });
};
 
const continueGame = () => {
  return new Promise((resolve) => {
    if (window.confirm("Do you want to continue?")) { // Ask the user if they want to continue the game resolve(true);
    } else {
      resolve(false);
    }
  });
};
 
const handleGuess = async () => {
  try {
    const result = await enterNumber(); // await replaces the then function alert(`Dice: ${result.randomNumber}: you got ${result.points} points`);
 
    const isContinuing = await continueGame();
 
    if (isContinuing) {
      handleGuess();
    } else {
      alert("Game ends");
    }
  } catch (error) { // The catch method can be replaced by try, catch function alert(error);
  }
};
 
handleGuess(); // Execute handleGuess function

const fetchData = async () => {
  const res = await fetch("https://restcountries.eu/rest/v2/alpha/cn"); // fetch() returns a promise, so we need to wait for it
 
  const country = await res.json(); // res is now only an HTTP response, so we need to call res.json()
 
  console.log(country); // China's data will be logged to the dev console
};
 
fetchData();

// Task 4: Get information about neighboring countries around China const fetchCountry = async (alpha3Code) => {
  try {
    const res = await fetch(
      `https://restcountries.eu/rest/v2/alpha/${alpha3Code}`
    );
 
    const data = await res.json();
 
    return data;
  } catch (error) {
    console.log(error);
  }
};

const fetchCountryAndNeighbors = async () => {
  const china = await fetchCountry("cn");
 
  console.log(china);
};
 
fetchCountryAndNeighbors();

const neighbors =china.borders.map((border) => fetchCountry(border));

const fetchCountryAndNeigbors = async () => {
  const china = await fetchCountry("cn");
 
  const neighbors = await Promise.all(
    china.borders.map((border) => fetchCountry(border))
  );
 
  console.log(neighbors);
};
 
fetchCountryAndNeigbors();

const fetchCountry = async (alpha3Code) => {
  try {
    const res = await fetch(
      `https://restcountries.eu/rest/v2/alpha/${alpha3Code}`
    );
    const data = await res.json();
    return data;
  } catch (error) {
    console.log(error);
  }
};
 
const fetchCountryAndNeigbors = async () => {
  const china = await fetchCountry("cn");
  const neighbors = await Promise.all(
    china.borders.map((border) => fetchCountry(border))
  );
  console.log(neighbors);
};
 
fetchCountryAndNeigbors();