이벤트 루프

이벤트 루프 모델은 javascript가 단일 스레드 언어임에도 불구하고 비차단 방식으로 I/O와 같은 많은 작업을 처리할 수 있는 가능성을 제공합니다.

시각적 표현

스택

스택은 후입선출(LIFO) 원칙을 따르는 데이터 구조입니다. 즉, 스택 내부에 삽입된 마지막 요소가 먼저 제거되고 js에서 호출된 모든 함수가 스택으로 푸시되고 완료되면 팝됩니다. 스택에서.

const last = ()=>{
  console.log("last")
}
const first = ()=>{
  last()
  console.log("first") 
}
first()
/*
last 
first
*/

더미

객체는 큰(대부분 구조화되지 않은) 메모리 영역을 나타내는 이름에 불과한 힙에 할당됩니다.

이벤트 루프

이벤트 루프는 큐에 이벤트를 넣고 스택이 비워질 때까지 기다린 다음 이벤트 핸들러를 스택으로 푸시하여 실행하는 루프처럼 들립니다.

const foo = ()=>{
 console.log("first")
}
setTimeout(()=>{
  console.log("second")
},0)
foo()
/*
 first 
 second
*/

setTimeout은 콜백을 실행하기 위한 최소 지연 시간(정확하지 않음)이 있는 webApi입니다. 이 예제에서 이벤트 루프는 setTimeout을 큐에 넣고 foo 함수를 호출 스택에 넣습니다. 함수 foo가 실행되면 스택이 비게 되고 이벤트 루프는 setTimeout 콜백을 호출 스택으로 푸시합니다.

결론

이벤트 루프 모델은 javascript가 단일 스레드 언어임에도 불구하고 비차단 방식으로 I/O와 같은 많은 작업을 처리할 수 있는 가능성을 제공합니다.