#6 - async/await

async/await?

지난 포스트 내용에 이어서 async/await는 promise와 동일하게 비동기 코드를 동기처럼 보이도록 하고 작동한다. 가장 최신문법에 포함된 내용으로 사용법을 알아보자.

• function 앞에 async를 붙여줍니다.
• promise 객체 앞에 await를 붙여줍니다.
• async가 붙은 함수는 promise 객체를 반환합니다. 따라서 .then((a) => {}를 이용할 수 있습니다.

//예제1
function delay() {
    return new Promise((resolve, reject) => {
        setTimeout(() => resolve(), 1000);
    })
}

async function getApple() {
    await delay();
    return "apple";
}

async function getBanana() {
    await delay();
    return "banana";
}

function getFruites() {
    getApple()
        .then((a) => { // 리턴값이 promise의 resolve()이므로 then 가능
            getBanana()
                .then((b) => console.log(`${a} and ${b}`));
        })
}

getFruites(); // 결과 : apple and banana

• await는 promise가 완료될 때까지 기다립니다.
• await는 promise가 resolve한 값을 내놓습니다.

/예제2
function delay() {
    return new Promise((resolve, reject) => {
        setTimeout(() => resolve(), 1000);
    })
}

async function getApple() {
    await delay();
    return "apple";
}

async function getBanana() {
    await delay();
    return "banana";
}

async function getFruites() {
    let a = await getApple(); // 리턴값이 promise의 resolve()이므로 대입 가능
    let b = await getBanana(); // getApple()이 처리되고 getBanana()가 처리됩니다.
    console.log(`${a} and ${b}`);
}

getFruites(); // 결과 : apple and banana

또다른 예외처리 방법

//then, catch문이 아닌 예외처리 방법
async function myAsyncFunTryCatch1() {
  console.log(new Date());
  try {
    await rejectedWait(1); // throw 되었다.
  } catch (e) {
    console.error('myAsyncFunTryCatch1', e);
  }
  // 그 다음일들을 쭉쭉할 수 있다.
  console.log(new Date());
}
const resultAsyncFunTryCatch1 = myAsyncFunTryCatch1();