[JS] async, await 함수

async 함수는 비동기 작업을 한다.

 

new Promise를 리턴하던 함수를 조금씩 수정하면 async함수로 변환이 가능하다.

 

- 함수에 async 키워드를 붙인다.

- new Promise 리턴을 없애고 executor 내용만 남긴다.

- resolve(value); 부분을 return value;로 변경한다.

- rejuect(new Error()); 부분을 throw new Error(...);로 수정한다.

function startAsync(age) {
  return new Promise((resolve, reject) => {
    if (age > 20)
      resolve('${age}');    
    else
      reject(new Error('error'));
  });
}

async function startAsync(age) {
  if (age > 20)
    return '${age}';
  else
    throw new Error(error);
}

이런식으로 바꿀 수 있다.

기존 함수를 async 함수로 바꾸면서 알 수 있는 내용은 async함수는 promise객체 자체를 리턴한다라는 것이다. 때문에 일반함수와 사용법을 달리해야만 한다. 이 불편함을 줄이기 위해 나온 문법이 await다.

 

function setTimeoutPromise(ms) {
  return new Promise((resolve, reject) => {
    setTimeout(() => resolve(), ms);
  });
}

async function startAsync(age) {
  if (age > 20)
    return '${age}';
  else
    throw new Error('${age}');
}

async function startAsyncJobs() {
  await setTimeoutPromise(1000);
  
  const pms1 = startAsync(25);
  try {
    const value = await pms1;
    console.log(value);
  } catch (e) {
    console.error(e);
  }
  const pms2 = startAsync(15);
  try {
    const value = await pms2;
    console.log(value);
  } catch (e) {
    console.error(e);
  }
}

startAsyncJobs();

await의 특징은 이렇다.

 

1. 문법적으로 await p[[Promise 객체]] 이렇게 사용한다.

2. await은 Promise가 완료될 때까지 기다린다.(동기식)

3. await은 resolve를 리턴한다. reject가 발생하는 건에 대해선 예외를 발생시킨다. 때문에 기존의 async함수를 쓰는것과 다르게 await을 쓸 때는 try catch를 써야한다.