본문 바로가기
자바스크립트

코드의 실행 순서

by 원석초이 2024. 2. 3.
// 1번
let num = 1;

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

// 3번
num = 3;

// 4번
console.log(num);
  1. let num = 1;: num 변수를 1로 초기화합니다.
  2. setTimeout(() => { num = 2; }, 0);: 이 부분은 비동기로 실행됩니다. setTimeout 함수의 콜백은 이벤트 루프에서 최소 지연 시간 이후에 실행되므로, 현재 코드의 실행 흐름이 지연됩니다. 하지만 이 지연이 0으로 설정되었기 때문에 실제로는 다음 틱에서 실행됩니다.
  3. num = 3;: num 변수를 3으로 변경합니다. 이 부분은 setTimeout의 콜백보다 먼저 실행됩니다.
  4. console.log(num);: num 변수의 현재 값인 3이 출력됩니다. 이미 num은 3으로 변경되어 있으므로 3이 출력됩니다. setTimeout의 콜백이 비동기로 실행되더라도 현재 코드의 실행 흐름과는 독립적으로 실행되기 때문에 출력 순서가 보장되지 않습니다
  5. 이렇게 모든 실행을 마치면, 그 후에 Event Loop를 돌아 Callback Queue에 있는 callback 함수를 Call Stack으로 가져와 실행하고 num 은 2가 재할당됩니다.