JavaScript-async/await

async/await

• Promise를 활용한 비동기 코드를 간결하게 작성하는 문법
• async/await 문법으로 비동기 코드를 코드처럼 간결하게 작성할 수 있다.
• async 함수와 await 키워드를 이용한다.
• await 키워드는 반드시 async 함수 안에서만 사용해야 한다.
• async로 선언된 함수는 반드시 Promise를 리턴한다.

async function asyncFunc() {
	let data = await fetchData()
  	let user = await
   fetchUser(data)
    return user
}

위의 코드와 같이 async 함수는 function 키워드 앞에 async를 붙여 만들고 async 함수 내부에서 await 키워드를 사용한다. 또한 fetchData, fetchUser는 Promise를 리턴하는 함수이다.

await 키워드 실행 순서

async function asyncRunc() {
	let data1 = await fetchData1()
    let data2 = await fetchData2(data1)
    let data3 = await fetchData3(data2)
    return data3
}
function promiseFunc() {
	return fetchData1()
  	  .then(fetchData2)
      .then(fetchData3)
}

• await 키워드는, then 메서드 체인을 연결한 것처럼 순서대로 동작한다.
• 비동기 코드에 쉽게 순서를 부여한다.

에러를 처리하는 방법

• Promise를 리턴하는 함수의 경우, 에러가 발생하면 아래와 같이 catch 메서드를 이용하여 에러를 처리한다.

function fetchData1() {
	return request()
  	.then((response)=>
response.requestData)
  	.catch(error => {
    	// error 발생
    })
}

• 아래 코드와 같이 try-catch 구문으로 async/await 형태 비동기 코드 에러 처리도 가능하다.

async function asyncFunc() {
	try {
    	let data1 = await
fetchData1()
      return fetchData2(data1)
    } catch (e) {
      console.log("실패: ", e)	
    }
}

• catch 절의 e는, Promise의 catch 메서드가 받는 반환 값과 동일하다.
• try-catch 구문을 세분화시켜 별도로 에러를 처리하는 것도 가능하다.