JavaScript Sec 02_8 Promise - 콜백 지옥에서 탈출하기

Promise

---

• 콜백지옥 : 연속적으로 콜백함수의 결과값을 또다른 콜백함수의 값으로 사용할 때, 계속해서 콜백이 깊어지는 현상
• 콜백지옥을 해결할 수 있는 자바스크립트의 Promise 객체

비동기 작업이 가질 수 있는 3가지 상태

1. Pending (대기 상태) : 현재 비동기 작업이 진행 중이거나 작업이 시작할 수 없는 문제가 발생했음을 의미
2. Fulfilled (성공) : 비동기 작업이 우리가 의도한 대로 정상적으로 완료되었음을 의미
3. Rejected (실패) : 서버가 응답하지 않는다거나 시간이 너무 오래 걸려서 자동으로 취소되는 등 모종의 이유로 비동기 작업이 실패했음을 의미

• promise 객체를 사용하지 않고 비동기 작업을 처리할 때

• promise 객체를 사용하여 비동기 작업을 처리할 때

 

• isPositiveP 함수의 리턴값이 promise 객체이다.
  • 어떤 함수의 리턴값이 promise 객체라는 것은, 이 함수는 비동기 작업을 하고 그 작업의 결과를 promise 객체로 반환받아서 사용할 수 있는 함수라고 이해하면 됨

 

promise 객체를 이용하여 비동기 작업 처리

• promise 객체의 메소드인 then과 catch를 사용하여 비동기 작업 처리
  • then의 파라미터에 콜백함수를 넣으면 resolve로 인식
  • catch는 reject로 인식

promise 객체를 이용하여 콜백지옥을 탈출하는 방법

콜백 지옥

promise 객체를 사용했지만 여전히 콜백 지옥이 발생 (then의 잘못된 사용)

 

함수 실행 부분만 이렇게 바꿔주면 콜백 지옥에서 벗어날 수 있다.

추가 설명)

taskA(5,1).then의 반환값은 taskB(a_res), taskB(a_res)는 taskB를 수행하고 반환받은 promise 객체.

⇒ 즉, taskA(5,1).then를 수행하면 taskB를 수행하고 반환 받은 promise 객체를 반환 받는다.

비동기 처리를 호출하는 코드 (bPromiseResult)와 결과를 처리하는 코드를 분리해 줄 수 있다.

• then chaining : then 메소드를 계속 이어 붙이는 것