본문 바로가기
WEB/JS

(js)Promise만들기(5) - then, catch (완)

by jackWillow 2024. 1. 28.

←(js)Promise만들기(4) - constructor, resolve, reject

 

CustomPromise - then

 

  • then는 다음 프로미스를 생성해서 현재 프로미스와 연결한 다음 반환하는 메소드입니다.
  • 프로미스에 빈 executor를 넣어서 nextPromise를 생성합니다.
  • 그 후 eventTarget에 fulfilled와 rejected의 이름으로 이벤트리스너를 저장합니다.
  • 각 이벤트 리스너에는 스위치를 nextPromise와 묶어서 호출하게 합니다.
  • 그리고 만약 현재 프로미스가 이미 확정된 상태라면 바로 이벤트를 보내 스위치를 누릅니다.
  • 마지막으로 nextPromise를 반환합니다.

 

스위치

 

  • runOnSettled는 다음 프로미스의 이행함수와 연결된 스위치입니다.
  • 이전 프로미스의 상태와 결과값, 그리고 콜백함수(thenCallback 혹은 nextResolve)를 인자로 받습니다.
  • onSettled(콜백함수)가 함수일 때, result를 담아 onSettled를 실행해 다음 프로미스에 넘겨줄 nextResult를 받습니다.
  • onSettled에서 에러가 발생하면 errorFunc을 통해 프로미스를 거부합니다.
  • 만약 nextResult가 프로미스라면 .then 메소드에 다음 프로미스의 이행함수를 담아 실행시킵니다.(프로미스 연결)
  • nextResult가 프로미스 외에 다른 값이면 다음 프로미스의 resolve콜백을 호출합니다ㅏ.
  • onSettled(콜백함수)가 함수가 아니라면 (ex: thenCallback이 undefined일 때) 이전 프로미스의 상태에 따라 각각 resolve콜백, reject콜백을 실행 시킵니다.

 

CustomPromise - catch

 

  • catch 메소드는 프로미스 거부되었을 때, 다음 프로미스에서 처리하는 로직을 담는 역할입니다.
  • then의 이행콜백(onFulfilled)가 없는 버전과 동일합니다.
  • 그래서 간단히 this.then에 이행콜백에 undefined, 거부 콜백에 onRejected를 담아서 반환하는 것으로 대체했습니다.

이번에 finally도 추가됬지만, 귀찮아서 넘기겠습니다.

그 외 all, any, race 등 도 다 넘기고, 여기서 마무리하겠습니다.

마치며

프로미스를 만들면서 느낀점은 프로미스만들기는 this를 연습하기에 최적의 예제라는 것입니다.

게다가 예전에는 resolve도 prototype메소드로 만들어서 이 this가 nextPromise건지 누구건지 몇번을 고쳤는지 모르겠습니다.

그래도 2번째 만들다보니 빠르기도 빨랐고, 코드도 더 깔끔해진 것 같습니다.

제 Promise의 부족한 점이나, 새로운 정보가 있다면 댓글로 알려주시면 감사하겠습니다.

끝까지 봐주셔서 감사합니다.

반응형