Javascript JS async / await

async

// 함수앞에 async를 붙이면 Promise로 반환된다
// 따라서 getName() 함수는 .then() .catch() .finally() 사용이 가능하다.
async function getName() {
  return "Mike";
}
getName().then(name => console.log(name));

// return 값을 Promise로 사용 가능
async function getName() {
  return Promise.resolve("Tom");
}
getName().then(name => console.log(name));

async function getName() {
  return new Promise((res, rej) => {
    res("James");
  });
}
getName().then(name => console.log(name));

 

await

function getName(name) {
  return new Promise((res, rej) => {
    setTimeout(()=> {
      res(name);
    }, 1000);
  });
}
async function showName() {
  const result = await getName('Mike'); // await는 async 함수 내부에서만 사용 가능
  console.log(result);
}
console.log("start");
showName();

 

ex)

// Promise 
const f1 = () => {
  return new Promise((res, rej) => {
      setTimeout(() => {
        res("1번 promise");
      }, 1000);
  });
};
const f2 = msg => {
  console.log(msg);
  return new Promise((res, rej) => {
      setTimeout(() => {
        res("2번 promise");
      }, 1000);
  });
};
const f3 = msg => {
  console.log(msg);
  return new Promise((res, rej) => {
      setTimeout(() => {
        res("3번 promise");
      }, 1000);
  });
};
// Promise 사용
// console.log("start");
// f1()
//   .then(res => f2(res))
//   .then(res => f3(res))
//   .then(res => console.log(res))
//   .catch(() => {
//     console.log("Error");  
//   })
//   .finally(() => {
//     console.log("end");
//   });


// async / await
console.log("start");
async function asyncAwait() {
  const result1 = await f1();
  const result2 = await f2(result1);
  const result3 = await f3(result2);
  console.log(result3);
  console.log("end");
}
asyncAwait();