(JS) Promise

호두파파·2021년 2월 1일
0

(JS) 함수

목록 보기
6/10

비동기 흐름을 제어하는 가장 전통적인 방법은 아래와 같이 콜백 함수를 이용하는 것이다.

function doSomethingAsync (callback) {
  setTimeout(fucntion () {
    calllback();
  }, 1000);
}

doSomethingAsync(function done1 () {
  console.log('done async work!');
});

doSomethingAsync(function done2 () {
  alert("done async work!!");
});

학습의 목적으로 위처럼 콜백 함수를 이용한 처리 방법을 사용하는 것은 괜찮은 방법이지만, 현업에서는 보다 트렌디한 해결책을 사용한다.

Promise

프러미스는 기본적으로 아래와 같은 형태의 객체입니다.

const promise = new Promise();

프러미스 생성자 함수는 함수를 인자로 받습니다.

const promise = new Promise(function () {
  // something..
});

프러미스 생성자 함수에 인자로 들어간 함수는 일반적으로 resolve, reject라고 부르는 2개의 매개 변수를 사용할 수 있습니다.

const promise = new Promise(function (resolve, reject) {
  // do something async here..
});

프러미스 생성자 함수에 인자로 들어간 함수 내부에서
비동기 작업을 하고, 비동기 작업이 성공할 경우 resolve를 실행해야 하고,
실패할 경우 reject를 실행해야 한다.

const promise = new Promise(function (resolve, reject) {
  // do something async here..
  fs.readFile(path, "utf-8", (err, data) => {
    if (err) {
      reject(err);
    } else {
      resolve(data);
    }
  });
});

위와 같이 생성한 프러미스 객체는 미래에 맞이할 성공 혹은 실패에 대한 결과값을 나타냅니다. 미래에 결과를 돌려주겠다는 약속이빈다. 모든 프러미스 객체는 다음 세 가지 상태 중 하나의 상태를 가지며, 한번이라도 성공하거나 실패한 프러미스는 초기 상태로 돌아갈 수 없습니다.

-Pending:아직 결과가 정해지지 않은 상태
-Fullfilled:성공한 상태
-Rejected:실패한 상태

profile
안녕하세요 주니어 프론트엔드 개발자 양윤성입니다.

0개의 댓글