VUE3.0을 빠르게 시작하는 방법:
얼마 전 필기 시험 문제를 공부하기 시작했을 때 약간 혼란스러웠습니다. 오늘은 JS의 이벤트 실행 메커니즘을 철저하게 분석하겠습니다.
. 친구 여러분, 인쇄 순서를 작성해 보세요.
JS
주로 브라우저의 스크립팅 언어로 사용됩니다. Js
의 주요 목적은 JS
JS
Java처럼 다중 스레드이고 두 개의 스레드가 작동하는지 확인하는 것입니다. 동시에 DOM을 구현하면 브라우저는 이를 어떻게 구현해야 할까요?
JS
의 출시는 실제로 Java의 인기를 활용하기 위한 것입니다. 언어가 작성된 지 얼마 되지 않았기 때문에
단일 스레드이기 때문에 작업을 정렬해야 합니다. 모든 작업은 규칙에 따라 실행됩니다.
동기 작업
비동기 작업
동기 작업과 비동기 작업은 실행 스택에 들어갑니다. JS는 먼저 작업 유형이
. 메인 스레드에 직접 들어가면
Event Table
에 들어가 콜백 함수 Event Queue
등록합니다.
후
JS는 Event Queue
에 진입합니다. 읽기 기능은
모든 작업이 완료될 때까지 이 프로세스를 반복적으로 실행합니다. 이것은 우리가事件循环
. 음, 잘 모르겠습니다. . . . JS에는 실행 스택이 비어 있는지 확인하는 고유한 논리가 있어야 합니다.
비동기 작업 실행 순서는 다음과 같습니다. 매크로 작업 -> 마이크로 작업
비동기
매크로 작업
으로 나눌 수 있습니다
.I/0
setTimeout
setInterval
Promise
.then
.catch
vite 이전에 구성된 플러그인, 버전에 문제가 있습니다. 이 빨간색 경보를 무시하세요.
동기 작업으로开始了
. 먼저
task()
함수를 실행하기 위해 실행 스택에 들어갑니다. a
는 동기 작업입니다.
비동기/대기 코드의 첫 번째 줄은 다음과 같습니다. 다음 코드는 비동기식으로 실행됩니다. b
동기 작업으로 실행 스택에 들어가고,
a end
비동기 작업의 마이크로 작업이 되어 실행 스택에 들어갑니다.
a
b
비동기 작업开始了
는 매크로를 시작했습니다
.task: setTimeout
: a end
그렇다면 여기서 질문이 생깁니다. 매크로 작업이 마이크로 작업보다 먼저 실행된다는 뜻이 아닌가요? setTimeout
a end
후에 인쇄되는 이유는 무엇입니까?
看这张图
setTimeout은 작업 대기열에 매크로 작업으로 들어갑니다.
일반적으로그 이유는 다음과
같습니다.
비동기 대기로 인해 마이크로 작업이 생성되지만 이 마이크로 작업은 현재 매크로 작업에 속합니다. 따라서 a end
먼저 실행되고, 실행 후에는 현재 매크로 태스크가 종료된 것으로 판단됩니다. 다음 매크로 작업을 실행하고 setTimeout
인쇄
c
Promise의 변환으로 인해 동기 작업이 되고 작업 대기열에 들어갑니다.
c end
Promise에서 파생된 마이크로 작업으로 작업 대기열에 들어갑니다
d
a
b
c
d
지금
a end microtask
c end microtask
setTimeout Macrotask
이므로 인쇄 순서는 다음과 같습니다.
JS 실행 메커니즘에 대한 제가 이해한 내용이 다소 부정확할 수 있으니 지적해 주시기 바랍니다.
[추천 관련 동영상 튜토리얼: 웹 프론트엔드]
위 내용은 JS의 이벤트 실행 메커니즘에 대한 세부 분석입니다. 자세한 내용은 PHP 중국어 웹사이트의 다른 관련 기사를 참고하세요!