javascript - setTimeout 문제

Question

기능 테스트() {

으아악

Answer 1

먼저 자바스크립트에 관한 글을 읽어보는 것을 추천합니다
자바스크립트 이벤트 루프 작동 메커니즘에 대한 자세한 설명

이 글에서는 JavaScript 이벤트 폴링의 원리를 자세히 설명합니다

주제의 질문에 대해 이야기해 봅시다:

1. 메인 스레드가 먼저 실행됩니다. test()가 실행되면 두 개의 setTimeouts가 동시에 작업 대기열에 들어간 다음 경고(0)가 실행되므로 이때 0이 먼저 출력됩니다. setTimeout이 아직 실행되지 않았으므로 a의 값은 19입니다. a에 대한 다른 할당 기회는 없습니다.

2. 메인 스레드가 실행된 후 예약된 작업을 실행하기 위해 작업 대기열을 폴링합니다. 첫 번째 setTimeout 시간이 두 번째 시간보다 짧기 때문에 이때 첫 번째 setTimeout 콜백이 먼저 실행됩니다. 약 1초 후에 출력됩니다. 그러면 a에는 5라는 값이 할당됩니다.

3. 그런 다음 두 번째 setTimeout을 실행합니다. 두 setTimeout이 동시에 대기열에 추가되므로 약 2초 후에 두 번째 setTimeout의 콜백이 실행되며, 이전 단계에서 얻은 5가 출력됩니다. 그러면 할당된 값은 4가 됩니다. 2초 정도 나오는 이유는 자바스크립트 타이머가 정확하지 않기 때문입니다

Answer 2

직접 디버그를 통해 메커니즘을 더욱 철저하게 이해할 수 있습니다

Answer 3

첫 번째 타이머가 실행된 후 전역 a는 5가 됩니다.
테스트 함수에서 a의 변화: 1-19-5-마지막 경고(a)-4