본문 바로가기
Language/JavaScript

Promise 다루기

by 그랴 2023. 11. 11.

Promise란

비동기 작업이 맞이할 미래의 완료 도는 실패와 그 결과 값을 나타내는 객체

 

프로미스가 생성된 시점에는 알려지지 않았을 수도 있는 값을 위한 대리자로, 비동기 연산이 종료된 이후에 결과 값과 실패 사유를 처리하기 위한 처리기를 연결할 수 있다.

프로미스를 사용하면 비동기 메서드에서 마치 동기 메서드처럼 값을 반환할 수 있다.

 

최종 결과 반환 (X)

미래의 어떤 시점에 제공하겠다는 '약속(Promise)' 반환 (O)

 

Promise의 3가지 상태

1. pending : 초기 상태

2. fulfilled : 연산이 성공적으로 완료됨

3. rejected : 연산이 실패함

 

fulfilled/rejected 시, 프로미스의 then 메서드에 의해 대기열에 추가된 처리기들이 호출됨

 

생성자

Promise()

const promise1 = new Promise((resolve, reject) => {
  setTimeout(() => {
    resolve('foo');
  }, 300);
});

promise1.then((value) => {
  console.log(value);
  // Expected output: "foo"
});

console.log(promise1);
// Expected output: [object Promise]

 

 

정적 메서드

Promise.all(iterable)

주어진 모든 프로미스가 이행되거나, 한 프로미스가 거부될 때까지 대기하는 새로운 프로미스를 반환함

- fulfilled : 매개변수로 제공한 프로미스 각각의 이행 값을 모두 모아놓은 배열 리턴

- rejected : 거부된 첫 프로미스의 사유

// 리트코드 2723. Add Two Promises

var addTwoPromises = async function(promise1, promise2) {
        const [value1, value2] = await Promise.all([promise1, promise2])

        return value1+value2
};

 

 

Promise.allSettled(iterable)

매개변수로 제공한 모든 프로미스 각각의 상태와 값(또는 거부 사유)을 모아놓은 배열 flxjs

 

Promise.any(iterable)

하나라도 이행되면 반환

 

Promise.race(iterable)

하나라도 처리(이행 또는 거절)되면 반환

 

Promise.reject(reason)

주어진 사유로 reject되는 프로미스 객체 반환

 

Promise.resolve()

주어진 값으로 이행하는 Promise.then 객체 반환

const promise1 = Promise.resolve(123);

promise1.then((value) => {
  console.log(value);
  // Expected output: 123
});

 

 

 

인스턴스 메서드

Promise.prototype.catch()

reject 시

 

Promise.prototype.then()

fulfilled 시

 

Promise.prototype.finally()

처리(reject/fulfilled) 시

 


📚 참고문헌

- https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Promise