<div id="result"></div>  
<div id="result2"></div>  
function getData() {
  return new Promise((resolve,reject) => {
    setTimeout(() => {
      reject({ result: "it doesn't work" });
    }, 2000);
  });
}
function saveData(elementId,type,value){
  var element = document.getElementById(elementId);
  element.innerHTML = `<p>${type} ${value}</p>`;
}
async function asyncF() {
  try{
    const { result } = await getData();
  }catch(error){
    const { result } = error;
    saveData('result','async error',result)
  } 
  
  
}

function promiseF() {
  getData().then(data => {
    const { result } = data;
     saveData('result2',' promise',result)
  },error => {
    const { result } = error;
     saveData('result2',' promise error',result)
  });
}
window.onload = function() {
  asyncF();
  promiseF();
};
Run Pen

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.