async, await

서재환·2021년 11월 23일
0

JavaScript

목록 보기
8/25

async

async 함수는 async 키워드를 사용해서 정의하고 명시적으로 프로미스를 반환하지 않더라도
항상 resolve한 Promise를 반환한다. 코드를 통해 살펴보자.

function foo() {
  return new Promise((resolve)=>{resolve('n')})
}

async function foo(n) {return n}

지금껏 Promise 생성자를 사용해서 반환하던 코드는 function 앞에 async를 붙임으로써
더욱 간단하고 간략하게 표현할 수 있다.

await

await 키워드는 프로미스가 settled 상태(비동기 처리가 수행된 상태)가 될때까지 대기하
다가 settled 상태가 되면 프로미스가 resolved한 처리 결과를 반환한다. 

await 키워드는 프로미스를 반환하는 것과 관련되므로 프로미스를 반환하는 것 앞에서 사용
해야 한다.
function delay(ms) {
  return new Promise(resolve=>setTimeout(resolve,ms))
}

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

위 코드를 통해 보면 알 수 있겠지만 async를 사용하면 간략하게 작성할 수 있다.

async를 붙이면 자동으로 resolve한 프로미스를 반환하고 resolve 함수의 매개변수를 바로 
return 에 기입하면 되기 때문이다.

만일 async와 await를 사용하지 않는다면 아래와 같이 보다 구조가 복잡해진다.
let ms = 1000;
function getApple(ms) {
  return new Promise((resolve)=>{setTimeout(()=>{resolve('apple')},ms)})
}

getApple(ms).then(v=>console.log(v));

0개의 댓글