Async Flow

Callback, Promise, async/await 흐름 비교

비동기 코드는 작업 시작, 대기, 성공, 실패 처리를 어떻게 표현하느냐가 핵심이다.

같은 비동기를 표현하는 세 방식

async model

Async Task

네트워크 요청이나 타이머처럼 나중에 끝나는 작업이다.

Callback

완료 후 실행할 함수를 인자로 넘긴다.

Promise

성공과 실패를 then/catch 체인으로 연결한다.

async/await

Promise를 동기 코드처럼 읽히게 작성한다.

Error Path

callback error, catch, try/catch로 실패를 처리한다.

State Update

성공 결과를 React state에 반영해 화면을 갱신한다.

작업 시작대기성공/실패상태 갱신
읽는 법

async/await는 비동기를 없애는 문법이 아니라 Promise 흐름을 읽기 쉽게 만드는 문법이다.