프로미스 API

Yun Young Choi·2022년 12월 15일
0

Javascript

목록 보기
7/7
post-thumbnail

Promise 클래스에서 제공하는 5가지 정적 메서드

Promise.all(promises)

모든 프로미스가 이행될 때까지 기다리고 결과값 담은 배열 반환

  • 요소 전체가 프로미스인 배열을 받고 새로운 프로미스 반환
    • 배열 안 프로미스 결과값 담은 배열을 then 핸들러로 반환
  • 하나라도 거부된 프로미스가 있다면 그 즉시 Promise.all 메서드는 종료되고 에러 핸들링 함수로 실패한 에러 객체가 전달된다

ex) 복수의 URL 동시 요청, 결과를 모두 받아서 최종 처리


// let p = Primise.all([...promises...]);

// 가장 늦게 처리되는 프라미스가 이행되기까지 3초가 걸리므로, 결과적으로 3초후 then 핸들러
가 실행됨
Promise.all([
	new Promise(resolve => setTimeout(() => resolve(1), 3000)), // 1
	new Promise(resolve => setTimeout(() => resolve(2), 2000)), // 2
	new Promise(resolve => setTimeout(() => resolve(3), 1000)) // 3
])
// 프라미스 전체가 처리되면 결괏값이 담긴 배열([1, 2, 3])이 반환됨
.then(alert);
  • 요소 순서는 프로미스 요소 순서와 상응

Promise.allSettled(promises)

  • 모든 프로미스가 처리될 때까지 기다리고 결과 정보가 담긴 객체 배열 반환
  • 하나라도 거절되면 모두 거절 "모두 정상"인 상황인 경우 사용
  • 모든 프로미스가 처리(성공, 거절 모두 포함) 될 때까지 기다리며 반환할 배열에 다음 내용을 담은 요소 추가
  • Promise.allSettled는 모든 Promise가 처리될 때까지 기다린다. 중간에 거부(실패)된 Promise가 있더라도
응답이 성공할 경우 - { status: "fulfilled", value: result }
에러가 발생한 경우 - { status: "rejected", reason: error }

Promise.race(promises)

  • 가장 먼저 처리된 프로미스 결과 또는 에러를 담은 프로미스를 반환
Promise.race([
	new Promise((resolve, reject) => setTimeout(() => resolve(1), 1000)),
	new Promise((resolve, reject) => setTimeout(() => reject(new Error("에러 발생!")), 2000)),
	new Promise((resolve, reject) => setTimeout(() => resolve(3), 3000))
])
// 첫 번째로 전달한 프라미스 객체가 제일 빨리 이행되므로 결괏값이 출력됨
.then(alert)

// Q) 두 번째 프라미스가 먼저 실패하도록 시간을 수정해보고 결과 생각해보기 => 두 번째 프로미스 시간을 0으로 바꾸고 결과는 에러발생!!
.catch(alert);

Promise.resolve(value)

  • 주어진 값으로 이행(fulfilled) 상태의 프로미스 생성
  • 호환성을 위해 함수가 프라미스 객체를 반환하도록 해야 할 때 사용 가능

let promise = new Promise(resolve => resolve(value));

Promise.reject(error)

  • 주어진 에러로 거부(rejected) 상태의 프로미스 생성
let promise = new Promise((resolve, reject) => reject(error));

  1. Promise.all은 하나라도 실패하면 다 실패해야하는 '모 아니면 도' 상황에 사용하면 좋다.
  2. Promise.allSettled는 안정된 메소드로 하나가 실패하더라도 모든 promise들의 결과를 받을 수 있으며 status 값에 따라 잘 분기처리 해주면 된다. 하나가 실패하더라도 다른 값들은 사용해야할 때 사용하면 좋다.

출처 감사합니다 저를 살리셨어요 최고짜 ㅇ흑흑따윽


요악

Promise.all

  • 여러 개 프로미스 동시 실행, 모두 준비될 때까지 기다린다.
  • 요소 전체가 프로미스 배열을 받고 새 프로미스 반환
    • 배열 안 프로미스 모두 성공되면 프로미스 이행
    • 배열 안 프로미스 결과값을 담은 배열이 then 핸들러로 반환
  • 배열 요소 순서는 프로미스 요소 순서와 상응
  • 하나라도 실패하면 에러와 함께 모두 거부

Promise.allSettled

  • 하나라도 거절되면 전체를 거절
  • "모두 정상"인 상황을 기대할 경우 사용
  • 모든 프로미스가 처리(성공, 실패 다) 될 때까지 기다림
  • 반환할 배열에 다음의 내용을 담은 요소 추가

    응답이 성공할 경우 - { status: "fulfilled", value: result }
    에러가 발생한 경우 - { status: "rejected", reason: error }


Promise.race

  • 가장 먼저 처리하는 프로미스의 결과 혹은 에러 반환

Promise.resolve/reject

  • resolve는 결과값이 value인 이행 상태 프로미스 생성

let p = new Promise(resolve = > resolve(value));

  • reject는 결과값이 error인 거부 상태 프로미스 생성

let p = new Promise(reject => reject(error));

profile
안냥하세요

0개의 댓글

관련 채용 정보