비동기 출력 순서는 작업이 들어가는 큐가 결정한다

코드에 적힌 순서와 실제 실행 순서를 call stack·microtask·task로 나눠 읽는다.

동기

Call stack

현재 함수와 console.log를 끝까지 실행

예약

Promise.then

microtask queue에 callback 등록

예약

setTimeout

task queue에 callback 등록

비움

Microtasks

현재 stack 뒤 Promise 작업을 모두 처리

다음 turn

Task

timer callback을 한 차례 실행

핵심React effect도 render 중 즉시 실행되지 않으며 commit 이후 별도 단계에서 외부 동기화를 시작한다.