본문 바로가기
boostcamp-challenge

[7/29] Javascript event 학습중...

by blopz 2024. 7. 29.

callback 함수

어떤 시점에 시스템에서 호출하는 함수

Task Queue, Web API, Event loop (병렬처리와 스레드)

javascript 는 single thread이면서 async를 구현해야한다 -> 어떻게????

 

Javascript Engine 외부에 Web API와 Task Queue, Event Loop가 존재하기 때문이다.

 

setTimeout(callback())을 하면 setTimeout(callback())째로 Web API에 전달했다가, 지정된 시간이 지나면 Task Queue에 callback()함수를 넘겨준다

 

이때 Task Queue가 callback() 함수들을 저장해놨다가, Javascript Engine의 Call Stack이 비어있을때 순차적으로 추가한다.

 

Event loop는 여기서 Call Stack이 비어있는지, Task Queue에 Task가 존재하는지 판단하고, Task Queue의 작업을 Call Stack에 옮기는 일을 한다.

event handler와 listener

이벤트가 발생했을 때 호출될 함수를 event handler라고 함

 

js에서 이벤트를 동적으로 처리하는 방식은 event listener

Promise

어떤 작업에 관한 '상태 정보'를 갖고 있는 객체.

 

비동기 작업을 순차적으로 처리하기 위함 (이게 callback함수인데 callback 함수를 보기좋게 하기위해서 Promise를 사용)

 

promise는 then, catch, finally 3가지 메서드를 가짐

  • then: promise 객체가 fulfilled 상태가 되면 실행할 콜백함수를 등록하는 메서드
  • catch: promise 객체가 rejected 상태가 되면 실행할 콜백함수를 등록하는 메서드
  • finally: 어떤 작업의 성공, 실패 여부와 상관없이 항상 실행하고 싶은 콜백함수를 등록하는 메서드

event emitter

EventEmitter를 상속한 객체를 만들고

 

on() 메서드를 사용해 이벤트 리스너를 등록하면, 이벤트가 발생할때마다 등록된 콜백함수가 실행됨

 

여러개의 콜백함수를 동시에 처리할수 있다는 장점

비동기 처리 문법

async / await

async function 함수명(){
  await 비동기처리메서드명(); // -> 반드시 Promise객체를 반환
}

Thread Pool

CPU or I/O Intensive한 작업에 내부적으로 쓰임

 

기본값은 4임