Promise 문법

신윤지·2022년 5월 29일
0

TIL

목록 보기
2/5
post-thumbnail

프로미스는 비동기함수의 콜백지옥을 해결하기 위해 등장했다. 함수 안에 수많은 중첩 함수들을 알아보기 쉽게 정리할 수 있다. 네트워크를 읽는다던지 파일을 불러오는 데 적합하다.

문법

let promise = new Promise(function(resolve, reject) {
  executor 콜백 함수
});

작동원리

promise의 State 변화도

  • state — 처음엔 "pending"(보류)이었다 resolve가 호출되면 "fulfilled", reject가 호출되면 "rejected"로 변함
  • result — 처음엔 undefined이었다 resolve(value)가 호출되면 value로, reject(error)가 호출되면 error로 변함

  • resolve(value) — 일이 성공적으로 끝난 경우 그 결과를 나타내는 value와 함께 호출
  • reject(error) — 에러 발생 시 에러 객체를 나타내는 error와 함께 호출
    둘 중 반드시 하나를 호출하고 한 번 호출하면 상태가 변하지 않는다.

then

promise.then(
  function(result) { /* 결과(result)를 다룹니다 */ },
  function(error) { /* 에러(error)를 다룹니다 */ }
);

작업이 성공했을 때의 여부를 다룬다. 위의 코드에서 resolve되었다면 첫번째 함수를, reject 되었다면 두번째 함수를 실행시킨다.

catch

promise
  .then(function(value) {...},)
  .then(function(value) {...},)
  ...
  .catch(function(err) {...},)

then이 여러 번 쓰여 많은 갈래가 만들어졌다면, 마지막에 catch 구문을 하나 쓰는 것으로 에러를 잡을 수 있다.


참고 자료
https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Promise
https://ko.javascript.info/promise-basics
https://www.youtube.com/watch?v=JB_yU6Oe2eE&list=PLv2d7VI9OotTVOL4QmPfvJWPJvkmv6h-2&index=12

0개의 댓글