teddy8 Full Stack Software Engineer

JavaScript Async

2019-07-20
teddy8

Async란?

async함수는 ECMAScript2017(ES8)에 추가되었습니다.
그 이유는 promise는 여전히 코드의 가독성이 좋지 않기 때문입니다.
async함수 안에 있는 await구문과 함께 비동기 작업을 제어할 수 있습니다.
async함수의 동작방식은 처음 async함수가 호출되고,
await키워드가 붙은 promise를 실행하면 비동기 작업을 처리합니다. 그 후,
async함수는 일시 중지 상태로 promise의 해결(resolve)을 기다립니다. 
이 작업이 완료되면 async함수가 다시 실행되고 함수 결과를 반환합니다.

예제

JavaScript 프로미스(Promise)

Async예제는 위의 promise 예제와 비교하여 보시면 좋습니다.

example.js

function doWork(name, server) {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      if (server.traffic > 30) {
        server.traffic -= 30;
        resolve({
          result: `${name} exec`
        });
      } 
      else {
        reject(new Error(`${name} failed`));
      }
    }, 1000);
  });
};

const server = { traffic: 100 };

const execute = async function () {
  try {
    let v = await doWork('work1', server);
    console.log(v.result);
    v = await doWork('work2', server);
    console.log(v.result);
    v = await doWork('work1', server);
    console.log(v.result);
    v = await doWork('work2', server);
  } catch (e) {
    console.log(e);
  }
}

execute();
console.log("hello");

출력 결과

hello
work1 exec
work2 exec
work1 exec
Error: work2 failed

Similar Posts

Comments