본문 바로가기
Front-End Study/코드잇 위클리 페이퍼

이벤트 루프 찍먹용 간단한 비동기 함수 동작원리

by 코딩기 2024. 4. 8.
728x90

예시 코드


let num = 1;

setTimeout(() => {
  num = 2;
}, 0);

num = 3;

console.log(num);

🔖위 코드는 let 키워드로 num 변수에 1을 할당하고, setTImeout()과 단순 할당을 사용해 num의 값이 무엇일지 유추한다.

✅setTimeout의 delay 값을 0으로 설정하더라도, setTimeout과 같은 비동기 함수의 콜백은 결국 콜스택의 코드가 모두 실행된 후에 실행된다.
✅fetch()나 async/await, setTimeout/setInterval과 같은 비동기 동작 함수들은 기본적으로 콜스택에 들어있는 코드들이 모두 실행된 후에 콜스택에 들어가 실행된다.


➡️따라서 setTImeout의 콜백 함수가 실행되는 시점은 이미 console.log(num)이 실행된 후이므로, num의 값은 3이 된다.