promise

양선희·2021년 3월 3일
0

es6

목록 보기
1/2
post-thumbnail

✅ Promise

promise는 비동기적인 것을 수행할때 콜백함수 대신 유용하게 쓸 수 있다.

기본 문법

promise구문을 만들면 자동적으로 executor가 실행됨.

const promise = new Promise(function(resolve, reject) {
  // executor
});

resolve와 reject는 자바스크립트가 제공하는 콜백 함수로,
기능을 정상적으로 수행해서 최종 데이터를 전달하는 resolve와
기능에 문제가 생기면 호출하게될 reject

then

promise.then(
  function(result) { /* 이행 되었을때 실행 */ },
  function(error) { /* 거부 되었을때 실행 */ }
);

promise값이 정상적으로 잘 수행이된다면 then을 쓰고 그 결괏값을 받아 작동한다.
두 번째 인자는 비동기 처리 실패 시 오류를 받아 작동하는 함수이다.

catch

promise.then(
   function(result){}
).catch(
   function(error){}
)

catch는 에러가 발생한 경우 실행
두번째로 전달했던 함수를 catch안으로 넣어줌.
이렇게 catch안으로 구분해서 넣어주는게 가독성에도 좋고 첫번째 함수를 실행했다가 나는 에러도 잡아줄수 있음

👉 Promise 기능 사용하기

const promise = new Promise((resolve, reject) => {

  console.log('doing something...');
  
  setTimeout(() => {
    resolve('j');
    // reject(new Error('no network'));
  }, 2000);
  
});

promise //
  .then(value => { // 성공하면
    console.log(value);
  })
  .catch(error => { // 실패하면
    console.log(error);
  })
  .finally(() => { // 성공하던 실패하던 마지막으로 무조건 실행
    console.log('finally');
  });

new Promise()로 프로미스를 생성
resolvereject 매개변수를 넣어주고
promise변수에 thencatch를 붙일 수 있다.

resolve가 호출되면 then이,
reject가 호출되면 catch가 실행된다.

0개의 댓글