이벤트 루프 & 콜백 함수

·2023년 4월 13일
0

데일리 과제

목록 보기
1/15

1. 이벤트 루프 (Event Loop)에 대해 설명해보세요.

  • task가 들어오길 기다렸다가 들어오면 이를 처리하고, 처리할 task가 없는 경우엔 잠드는, 끊임없이 돌아가는 자바스크립트 내 루프
  • Callback Event Queue에서 하나씩 꺼내서 동작시키는 Loop

자바스크립트는 이벤트 루프를 이용해서 비동기 방식으로 동시성을 지원한다.

  • 이벤트 루프에서는 이벤트 발생 시 호출되는 콜백 함수들을 task queue에 전달하고, task queue에 담겨있는 콜백 함수들을 call stack에 넘겨준다.

    	* 이벤트 루프가 task queue에서 call stack으로 콜백 함수를 넘겨주는 작업은 call stack에 쌓여있는 함수가 없을 때만 수행
  • 태스크 큐에서는 web api에서 비동기 작업들이 실행된 후 호출되는 콜백함수들이 기다리는 공간이다.

    * 이벤트 루프가 정해준 순서대로 줄을 서있으며, FIFO방식을 따른다.

비동기 작업을 수행하는 코드는 아래의 순서로 실행된다.

  1. 코드가 호출스택에 쌓인 후, 실행되면 자바스크립트 엔진은 비동기 작업을 Web API에게 위임한다.
  2. Web API는 해당 비동기 작업을 수행하고, 콜백 함수를 이벤트 루프를 통해서 태스트 큐에 넘겨주게된다.
  3. 이벤트 루프는 콜스택에 쌓여있는 함수가 없을 때, 태스크 큐에서 대기하고 있던 콜백함수를 콜스택으로 넘겨준다.
  4. 콜스택에 쌓인 콜백함수가 실행되고, 콜스택에서 제거된다.

2. 콜백 함수 (Callback Function)가 무엇인지, 어떻게 사용되는지 설명해보세요.

- 다른 함수의 인자로써 이용되는 함수

function printHello(){
 print('hello');
}

function printBye(){
  print('bye');
}

// 특정 함수를 매개변수로 받아서 3초 뒤에 실행하는 함수
function sleepAndExecute(sleepTimeSecond, callback){
 
  sleep(sleepTimeSecond);  // sleepTimeSecond 초 만큼 대기
  
  callback(); // 전달된 callback 실행
}

// 3초 뒤에 hello 출력하기
sleepAndExecute(3, printHello);

// 5초 뒤에 bye 출력하기
sleepAndExecute(5, printBye);

sleepAndExecute(3, printHello); 에서는 printHellosleepAndExecute의 매개변수(인자)로 전달하므로,

printHellocallback 함수라고 할 수 있다.

마찬가지로, sleepAndExecute(5, printBye)에서는 printByesleepAndExecute의 매개변수(인자)로 전달하므로,

printByecallback 함수라고 할 수도 있다.

- 어떤 이벤트에 의해 호출되어지는 함수

function onCableConnected(){
	print("케이블이 연결되었습니다");
};

//케이블이 연결될 때 마다 전달된 onCableConnected가 호출된다고 가정
setOnCableConnected(onCableConnected);

setOnCableConnected로 설정한 함수가, 케이블을 연결할 때 마다 호출되므로,

onCableConnected는 "어떤 이벤트에 의해 호출되어지는 함수", 즉 callback 함수 라고 할 수 있다.

profile
개발자가 되는 과정

0개의 댓글