[javascript] async/await 사용법 개선
JavaScript에서 비동기 작업을 처리할 때 async 및 await 키워드를 사용하여 코드를 깔끔하게 정리할 수 있습니다. 이를 활용하여 비동기 코드를 효율적으로 개선하는 방법을 알아보겠습니다.
1. async 함수로 변환
기존의 콜백 함수나 프로미스 체인을 async/await를 사용하여 변환할 수 있습니다. 아래는 이전의 코드와 비교한 예시입니다.
// 이전의 콜백 함수
function fetchData(callback) {
setTimeout(() => {
callback('Data fetched successfully');
}, 2000);
}
// async/await로 변환
async function fetchData() {
return new Promise(resolve => {
setTimeout(() => {
resolve('Data fetched successfully');
}, 2000);
});
}
2. await로 비동기 작업 순서 제어
await 키워드를 사용하여 비동기 작업이 완료될 때까지 기다릴 수 있습니다.
async function getData() {
let firstData = await fetchData1(); // fetchData1가 완료될 때까지 기다림
let secondData = await fetchData2(); // fetchData2가 완료될 때까지 기다림
return { firstData, secondData };
}
3. try-catch로 예외 처리
async/await를 사용하면 try-catch 블록을 사용하여 예외를 처리할 수 있습니다.
async function fetchAndProcessData() {
try {
let data = await fetchData();
await processData(data);
} catch (error) {
console.error('An error occurred:', error);
}
}
async/await를 적절히 활용하여 비동기 코드를 깔끔하게 작성할 수 있습니다. 이를 통해 코드의 가독성과 유지보수성을 향상시킬 수 있습니다.