setTimeout이 실행되면 어떤 동작이 일어날까?

setTimeout 을 실행했을 때 어떤 일이 일어나는지 차례로 확인해보자

1. 코드블록에서 해당 코드가 실행되면서 Call Stack 에 올라온다.

2. setTimeout 을 JS의 콜스택에서 실행한다.

   • 앗? setTimeout 은 WEB API 잖아? 그러면 넘기면 되겠군!

3. JS의 콜스택에서는 setTimeout 에 관련된 액티브 레코드가 제거된다.

4. 그리고 브라우저는 setTimeout 을 실행한다.

5. 현재는 JS의 콜스택과 QUEUE 에 아무것도 없으므로 EVENT LOOP는 무작정 어디에선가 일이 나오기만을 기다리면서 뻉글뺑글 돌고있는다 == 논블락

6. 브라우저에서 등록된 setTImeout 실행을 끝냈다 그러면 해당 메서드에 전달됐던 Call back 이 QUEUE로 넘어간다.

7. EVENT LOOP 는 런타임환경을 살펴보다 QUEUE 에 콜백 메서드가 들어온걸 발견했고 여기서 멈춘다.

8. 그리고 JS의 콜스택을 확인한다. 만약 콜스택에서 무언가 실행되고 있다면.(비어있지 않다면) EVENT LOOP 는 QUEUE에 대기한채 기다리고 있는다.

9. JS의 콜스택이 비어졌다. 그러면 이제 EVENT LOOP 는 QUEUE 에 있는 콜백메서드를 JS의 콜스택으로 이동시킨다.

10. 이동된 콜백메서드는 이제 실행이된다.

콜스택에서 무언가 실행된다면 실행되고 있는 블록은 보장된다!!

JS의 콜스택에서 무언가 실행이 된다면 그 실행되는 블록은 보장된다! 보장이 된다는 말은 중간에 다른일들을 할 수 없고 현재 코드 블록이 끝날때까지 EVENT LOOP가 기다리고 있다는 것이다.