본 포스팅은 패스트캠퍼스 환급 챌린지 참여를 위해 작성하였습니다.
https://fastcampus.info/4n8ztzq
250725(금) 25일차
문법 - 비동기 함수
기존 Promise 방식의 한계
기존 Promise를 사용할 때는 .then( ), .catch( ) 체이닝을 통해 비동기 처리를 이어나갔지만
이 방식은 콜백의 중첩이나 로직이 많아질수록 가독성이 떨어지고 디버깅이 어려워지는 단점이 있다
delay(3000)
.then(result => console.log(result))
.catch(err => console.error(err));간단한 로직이면 괜찮지만 조건 분기나 반복, 에러 처리가 얽히면 난이도가 급격히 올라감
async/await를 활용한 코드 개선
async 키워드 하나로 함수의 성격이 바뀌고, await 키워드로 비동기 처리 결과를 동기 코드처럼 다룰 수 있다
async function main() {
try {
const result = await delay(3000);
console.log("비동기 작업이 끝났어:", result);
} catch (error) {
console.error("에러 발생!", error);
}
}await 덕분에 타이머 기반의 비동기 코드도 한 줄 한 줄 읽히는 코드로 바뀌어 가독성과 유지보수성이 확연히 향상된다.
- async는 함수 앞에 붙여 해당 함수가 항상 promise를 반환하도록 만든다
- await는 Promise가 처리될 때까지 기다리고, 결과 값을 받아온다.
- try/catch로 성공/실패 흐름을 명확하게 분리할 수 있어 에러 핸들링이 매우 직관적이다.
- 코드 흐름 자체가 동기식처럼 읽히면서도 실제 동작은 논블로킹(비동기)이라는 점이 매우 강력하다.
이번 강의는 비동기 함수
비동기 함수는 단순히 문법을 편하게 하기 위한 도구가 아니라 코드의 표현력을 높이는 중요한 기술
ui 처리를 하거나 api 요청을 다룰 때, 코드가 명료해야 디버깅이나 유지보수가 수월해지는데 async/await는 그 목적에 부합
비동기 함수는 결국 promise 위에 구축된 문법이기 때문에 promise에 대한 충분한 이해 없이는 오히려 더 혼란스러워질 수 있으니 주의하기
