JS #5 Syntax (5) - Promise

황은하·2021년 9월 30일
0

JS

목록 보기
5/19

Promise

: 비동기함수.
const hi = async () => {} 이렇게도 기능은 같다.
try-catch와 비슷하다.
Promise 객체를 반환한다.

Promise 객체는 비동기 작업이 맞이할 미래의 완료 또는 실패와 그 결과 값을 나타냅니다. (in MDN)

function waitfor2000(input) {
  return new Promise((resolve, reject) => {
    if (input)
      resolve('hello');
    else 
      reject('refuse!');
  });
}
const result = waitfor2000('hi');
console.log(result);

여기서 resolve, reject => excutor.
성공하면 resolve 함수가, 실패하면 reject 함수가 실행된다.

try-catch
: 네트워크에서는 이걸로 사용한다.

try {
  ...
} catch (error) {
  console.error(error.message);
}

Promise의 세 가지 상태

  • 대기(pending): 초기 상태. 이 함수가 아직 끝나지 않은 상태. 이행하거나 거부되지 않았다.
  • 이행(fulfilled): 해결됨. 연산이 성공적으로 완료되었다.
  • 거부(rejected): 미해결. 거절됨. 연산이 실패함.

pending -> fulfilled or rejected

이행이나 거부될 때, 프로미스에 연결된 처리기는 그 프로미스의 then 메서드에 의해 대기열에 오른다.

메서드

  • .then
    : Promise가 끝나서 fulfilled 될 때 실행된다.
    .then().then()... 이런식으로 chaining도 되지만, 복잡하니까 try-catch를 사용한다.
  • .catch
    : rejected 됐을 때 실행된다. Promise 객체를 반환한다.
  • .finally
    : 마지막일 때 실행된다.
  • .all
    : 병렬적으로 실행하고자 할 때 사용된다.
    매개변수로 Promise 객체들이 여러개 들어간다.
    하나라도 문제가 발생하면 다 문제가 생긴다. -> 모든 Promise가 좋을 때 사용하자.
    모든 Promise가 다 실행될 때까지 기다린다.
  • .allSettled
    : 오류가 생겨도 일단 다 반환한다.
    문제가 발생하면 2번 정도 더 실행해보고 그래도 문제가 있다면 catch로 거른다.
  • .any
    : 먼저 fulfilled 된 것을 먼저 받는다.
  • .race
    : 성공이든 실패든 일단 먼저 끝난 것을 반환한다.

Promise .then() = async await

MDN을 읽어보자.

profile
차근차근 하나씩

0개의 댓글