이는 일이 원인, 나는 소를 날려
과 동생은 정말 나에게 얼굴 질문을했다! ! ! 나는 나 자신을 찾을 수 없음! ! ! (╯¯Д¯는) ╯╘═╛
하지만 지금은 누수가 가득. 주로 자바 스크립트 매크로 및 마이크로 작업 큐 작업 큐의 내용과 관련이 문서, 후속 내가 비동기 자바 스크립트를 정돈 할 수있는 기회가있다?
먼저,이 코드는 출력이 무엇인지에 대해 생각해 봅시다.
const p = new Promise(function(resolve, reject) {
resolve();
setTimeout(() => {
console.log(1);
});
console.log(2);
}).then(res => {
console.log(3);
});
console.log(4);
답은 2413입니다
나는 매우 아 왜 모르는 의아해하고 있지 않다. 자바 스크립트는이 주문이 너무 혼란스러워했다 방법, 당신에게서 아래로 해결되지 않습니다. 이 비동기 문제를 포함한다.
비동기 실행 순서는 어떻게을의 종류
파싱 JS 코드 블록 부분이 순차 동기, 비동기 부분을 수행 MacroTask는 큐 (매크로 작업 대기열) 및 MicroTask 큐 (마이크로 작업 대기열)을 반영한다.
MacroTask 큐 (매크로 작업 대기열)을 포함한다 :
setTimeout
,setInterval
,setImmediate
,requestAnimationFrame
,NodeJS中的I/O
,UI渲染
그리고에 이렇게.
MicroTask 큐 (마이크로 태스크 큐)는 주로 두 가지 종류를 포함한다 :
- 독립 콜백 Microtask :
Promise.then catch finally
서로의 성공 / 실패 콜백 함수와 독립적 - : 복합 콜백 Microtask
Object.observe
(사용되지 않음),MutationObserver
및NodeJs中的 process.nextTick
이들의 동일한 콜백 함수의 다른 상태;
작업 대기열 태스크로부터 판독 JS 메인 쓰레드 일정한주기라는기구를 실행하는 작업을 수행 하는 이벤트 루프 (이벤트 루프).
프로세스 루프는 다음과 같습니다 :
- (해결에 수행 완료 될 때까지 동기화 코드를 수행
</script>
태그); - 큐 MicroTask 확인
- 비동기 작업을 해결해야하는 경우, MacroTask를 비동기 적으로 구현이 완료 될 때까지 트리거 모든 작업을 수행 한 다음 큐를 확인하기 위해
- 비동기 작업이 처리되지 않는 경우, 큐 직접 MacroTask을 확인
- 큐 MacroTask 확인
- 트리거 비동기 작업을하면, 모든 작업이 실행이 끝날 때까지 계속 수행하기 위해, 등 첫 MicroTask가 큐에 참여 받아이를 처리합니다.
상단에이 글을 읽고 후. 이 문제는 해결 한 것입니다.
나는 아래 그림은 밖으로 표시했다.
- 동기화 코드
- 즉시 만들 것을 약속드립니다.
- 실행 해결 ()
- 만남의 setTimeout, 작업 큐에 매크로를 실행되지 않습니다
- 메치오닌 CONSOLE.LOG (2), 출력 2를 수행
- 그 때는 마이크로 작업 큐에 수행하지
- 만난 CONSOLE.LOG (4), 출력 4
- MicroTask 큐 :
- 약속은 CONSOLE.LOG를 수행, 그 때는있다 (3)의 출력 (3)
- MicroTask 빈 큐, 큐는 MacroTask을 확인
- MacroTask 큐 :
- 에서는 setTimeout은 큐 MicroTask에이 넣어
- 큐 MicroTask 확인
- MicroTask 큐 :
- 거기에서는 setTimeout 실행 CONSOLE.LOG (1), 출력
- MicroTask 빈 큐, 큐는 MacroTask을 확인
- MacroTask 큐 :
- 큐는 이벤트 루프의 끝 비어
나는 너무 피곤 아 해요