비동기 처리 (async, await)

Bin2·2022년 5월 28일
0
post-custom-banner

async, await

async와 await은 자바스크립트의 비동기 처리 패턴 중 가장 최근에 나온 문법이다.
기존의 비동기 처리 방식인 콜백 함수와 프로미스의 단점을 보완하고 개발자가 읽기 좋은 코드를 작성할 수 있게 도와준다.

async

Promise를 이용한 비동기 처리 방법은 다음과 같다.

function promise() {
	return new Promise((resolve, reject) => {
      	resolve('success');
	})
}

promise().then(result => console.log(result));

이를 쉽게 만들 수 있는 방법이 async 이다.

async function promise() {
	return 'success'
}

promise().then(result => console.log(result));

함수 앞에 async만 붙여주면, 그 함수는 프로미스 객체를 리턴한다.

await

await은 async 함수 안에서만 동작한다.
await 키워드를 만나면 프로미스가 처리될 때까지 기다린다.

async function delay() {
	const promise = new Promise((resolve, reject) => {
    	setTimeout(() => resolve('success'), 2000)
    })
    
    const result = await promise;
  
  	console.log(result);
}

에러 핸들링

async, await은 try, catch 문을 이용하여 에러 처리를 할 수 있다.

async function f() {

  try {
    let response = await fetch('http:....');
    let user = await response.json();
  } catch(err) {
    alert(err);
  }
}

f();
profile
Developer
post-custom-banner

0개의 댓글