1.Call Stack에서의 처리:
- 비동기 함수(예: setTimeout, fetch 등)는 먼저 Call Stack에 들어간다.
- Call Stack에서 실행되면서 비동기 작업을 Web API로 넘긴다.
- 비동기 함수 자체는 즉시 Call Stack에서 제거된다
2.Web API에서의 처리:
- Web API는 브라우저에서 제공하는 기능으로, 비동기 작업을 실행한다.
- 예를 들어, setTimeout의 타이머나 fetch의 네트워크 요청을 처리한다.
3.Task Queue로의 이동:
- 비동기 작업이 완료되면, Web API는 해당 작업의 콜백 함수를 Task Queue에 넣는다.
- 이 과정은 Event Loop나 Call Stack과는 독립적으로 일어난다.
4.Event Loop의 역할:
- Event Loop는 지속적으로 Call Stack과 Task Queue를 감시한다.
- Call Stack이 비어있고, Task Queue에 대기 중인 작업이 있으면, Event Loop가 Task Queue의 첫 번째 작업을 Call Stack으로 이동시킨다.
따라서, 비동기 함수가 Task Queue로 직접 이동하는 것이 아니라, 다음과
같은 과정을 거칩니다:
- 1.비동기 함수가 Call Stack에서 실행됨
- 2.비동기 작업이 Web API로 전달됨
- 3.비동기 작업 완료 후 콜백이 Task Queue로 이동
- 4.Event Loop가 Call Stack이 비었을 때 Task Queue의 작업을 Call Stack으로 이동
이 과정을 통해 JavaScript의 단일 스레드 특성을 유지하면서도 비동기 작업을 효율적으로 처리할 수 있다.