9주차: 비동기 JavaScript 이해

Source: Dev.to

비동기 JavaScript

9주차는 JavaScript가 비동기 작업을 어떻게 처리하는지 이해하는 것이었습니다: 콜백, 프로미스, async/await, 그리고 이벤트 루프.

콜백과 이벤트 루프

핵심 포인트: JavaScript의 호출 스택이 이벤트 루프와 어떻게 작동하는지 이해하는 것. JavaScript는 단일 스레드이지만, 이벤트 루프 덕분에 동시성처럼 느껴집니다.

• setTimeout이 정확한 타이밍을 보장하지 않는 이유를 배웠습니다.
• 비동기 작업은 실행을 차단하지 않습니다.
• 호출 스택, 웹 API, 콜백 큐가 함께 동작합니다.

콜백 헬은 더 나은 해결책이 필요함을 보여주었습니다. 세 단계 깊게 중첩된 콜백은 읽기 어려운 파멸의 피라미드가 됩니다.

프로미스

프로미스는 콜백 헬을 읽기 쉬운 체인 형태로 평탄화합니다.

• resolve와 reject로 프로미스 만들기.
• then과 catch로 체이닝하고 오류를 올바르게 처리하기.
• Promise.all은 여러 작업을 병렬로 실행하고 모두 완료될 때까지 기다립니다.
• Promise.race는 가장 먼저 끝나는 작업의 결과를 반환합니다.

Async/Await

Async/await는 모든 것을 바꾸었습니다. 동일한 비동기 코드를 동기 코드처럼 작성할 수 있어 then 체인이 필요 없습니다. 결과를 await만 하면 됩니다.

• 오류 처리는 try/catch를 사용합니다.
• 문법이 깔끔해지고 사고하기 쉬워집니다.

순차 vs 병렬

• 순차 await는 하나씩 실행되며, 세 작업을 수행하는 데 총 3초가 걸립니다.
• Promise.all은 병렬로 실행되어, 동시에 실행될 수 있다면 세 작업을 총 1초 만에 끝낼 수 있습니다.

오류 처리는 까다로웠습니다. 언제 try/catch를 사용하고, 오류가 어떻게 전파되며, 실패를 적절히 처리하는지를 이해하는 것이 중요합니다.

핵심 교훈

이벤트 루프를 이해하는 것은 백엔드 개발에 필수적입니다. 단일 스레드임에도 불구하고 JavaScript가 어떻게 동시성을 처리하는지 설명해 줍니다.

앞으로의 계획

• API를 활용한 프로젝트 구축.
• 실제 시나리오에 비동기 JavaScript 적용.
• Node.js 기본 개념 학습 시작.

Question: JavaScript를 배우면서 가장 오래 걸렸던 개념은 무엇인가요?