Promise에 대해

Leo·2023년 7월 6일
0

FrontEnd

목록 보기
18/26
post-thumbnail

Promise란

  • 자바스크립트 비동기 처리에 사용되는 객체, 비동기 처리의 단점을 보완하여 동기적으로 처리할 수 있게 도와준다.

❓ 비동기 처리란?
특정 코드의 실행이 완료될 때까지 기다리지 않고 다음 코드를 먼저 수행하는 자바스크립트의 특성을 말한다.

promise가 필요한 이유

  • 서버에서 받아온 데이터를 처리하기 위해
  • fetch등으로 서버에서 데이터를 요청하고 받아온 뒤 처리하기 위하여 Promise가 필요하다

promise의 장점

  • promise는 .then(), .catch() 등 promiseAPI를 사용할 수 있어 코드의 양을 줄이고 가독성을 증가시킬 수 있다

promise의 3가지 상태

  • pending : 대기 - 비동기 처리 로직이 아직 완료되지 않은 상태
  • fulfilled : 이행 - 비동기 처리가 완료되어 프로미스가 결과 값을 반환해준 상태
  • rejected : 실패 - 비동기 처리가 실패하거나 오류가 발생한 상태

콜백함수 방식

  • callback 함수는 다른 함수의 인수로 넘겨줌으로서 (두번째 인자로 콜백을 넣음) 실행이 가능한 코드를 말한다.
  • callback 을 반복적으로 실행시키기 때문에 코드의 양이 길어지고 비교적 가독성이 떨어진다.

promise와 callback의 차이점

  • callback 함수는 함수안에서만 결과값 처리와 결과값을 알 수 있지만 promise 는 비동기 로직에서 처리된 결과값이 promise 객체에 저장되기 때문에 로직 밖에서도 사용 가능함
  • callback 함수는 함수 내부에서 계속해서 연달아 호출하므로 가독성이 떨어지지만 promise함수는 promiseAPI를 사용해 가독성을 높여준다
callback함수 예시
function async(result, callback) {

async(0, function (res, callback) {
  callback(res)
  async(res + 1, function (res, callback) {
    callback(res)
    async(res + 1, function (res, callback) {
      callback(res)
    });
  });
});

0개의 댓글