이 기사는 js의 이벤트 루프(EventLoop)에 대한 자세한 소개를 제공합니다. 이는 특정 참고 가치가 있으므로 도움이 될 수 있습니다.
이벤트루프를 배우기 전에 js의 단일 스레드와 비동기성에 대해 검토해야 합니다.
js는 단일 스레드이지만 브라우저와 Node.js에서는 그에 맞게 처리되었습니다. 브라우저의 웹 작업자(작업자 스레드)와 Node.js의 child_process(하위 프로세스) 등이 있습니다. 이들의 출현은 많은 양의 계산을 분해하는 것을 촉진했습니다.
프로세스가 시작되면 노드는 내부 관찰자를 사용하여 필요한 이벤트가 있는지 확인합니다. , 이벤트가 있는 경우 해당 이벤트 및 관련 콜백 함수를 꺼내 실행한 후 더 이상 없는 경우 프로세스를 종료합니다.
메인 스레드 UI 렌더링을 차단하지 않도록 브라우저의 작업자 스레드에 비동기 이벤트를 배치합니다
# 🎜 🎜#console.log('进程开始') const ajax = new XMLHttpRequest() ajax.addEventListener('load', () => { console.log('load') }) ajax.addEventListener('loadend', () => { if (ajax.readyState == 4 && ajax.status == 200) { console.log('ajax success') } else { console.log('ajax success') } }) ajax.open('get', 'http://localhost/study/html/vue.js') ajax.send() setTimeout(() => { console.log('setTimeout') }, 300) fetch('http://localhost/study/html/demo.json',{ headers: { 'content-type': 'application/json' } }).then(res => { console.log('fetch') }) let i = 0 while(i < 10000) { i++ } console.log(i) console.log('进程结束')
setTimeout(() => { console.log('setTimeout') }, 0) setImmediate(() => { console.log('setImmediate1') process.nextTick(() => { console.log('setImmediate1 插入nextTick') }) }) setImmediate(() => { console.log('setImmediate2') }) process.nextTick(() => { setTimeout(() => { console.log('nextTick1 setTimeout') }, 100) console.log('nextTick1') }) process.nextTick(() => { console.log('nextTick2') }) console.log('正常执行')
자바스크립트 이벤트 루프 메커니즘의 세부 사항 - 2강
# 🎜 🎜#
위 내용은 node.js의 이벤트 루프(EventLoop)에 대한 자세한 소개(코드 포함)의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!