Promise

Promise는 자바스크립트에서 비동기 작업을 보다 효율적으로 다룰 수 있도록 도와주는 객체입니다. 비동기 작업은 시간이 걸리는 작업(예: 서버에서 데이터를 가져오는 것)을 의미하며, 이러한 작업이 완료될 때까지 다른 코드의 실행을 막지 않고 병렬적으로 처리할 수 있게 해줍니다.

Promise의 기본 개념

Promise는 세 가지 상태 중 하나를 가집니다.

• Pending (대기): 비동기 작업이 아직 완료되지 않은 초기 상태.
• Fulfilled (이행): 비동기 작업이 성공적으로 완료된 상태. 결과 값(result)을 반환합니다.
• Rejected (거절): 비동기 작업이 실패한 상태. 오류(error)를 반환합니다.

// Promise 생성
const myPromise = new Promise((resolve, reject) => {
  // 비동기 작업 수행 (예: setTimeout)
  setTimeout(() => {
    const success = true; // 성공 또는 실패 여부
    if (success) {
      resolve("작업 성공!"); // 성공 시 resolve 호출
    } else {
      reject("작업 실패!"); // 실패 시 reject 호출
    }
  }, 1000);
});

// Promise 사용
myPromise
  .then((result) => {
    console.log(result); // "작업 성공!"
  })
  .catch((error) => {
    console.error(error); // "작업 실패!"
  })
  .finally(() => {
    console.log("작업 완료! 항상 실행됩니다.");
  });

• .then(): Promise가 Fulfilled 상태가 될 때 실행됩니다. 성공적으로 반환된 값을 인자로 받습니다.
• .catch(): Promise가 Rejected 상태가 될 때 실행됩니다. 발생한 오류를 인자로 받습니다.
• .finally(): Promise의 성공, 실패 여부와 관계없이 항상 마지막에 실행됩니다.

다양한 Promise 유틸리티 메서드

자바스크립트에는 여러 Promise를 한 번에 다룰 수 있는 유용한 메서드들이 있습니다.

Promise.all()

**Promise.all()**은 모든 Promise가 성공적으로 완료될 때까지 기다립니다. 만약 하나라도 실패하면 전체가 실패합니다.
반환 값: 모든 Promise의 결과 값을 배열로 반환합니다.

const promise1 = Promise.resolve(3);
const promise2 = 42; // Promise가 아닌 값도 가능
const promise3 = new Promise((resolve, reject) => {
  setTimeout(resolve, 100, 'foo');
});

Promise.all([promise1, promise2, promise3]).then((values) => {
  console.log(values); // [3, 42, "foo"]
}).catch(error => {
  console.error(error);
});

Promise.allSettled()

**Promise.allSettled()**는 모든 Promise가 완료될 때까지 기다리며, 성공/실패 여부에 관계없이 결과를 반환합니다. 전체가 실패하지 않고, 각 Promise의 상태와 결과를 객체 형태로 담아 배열로 반환합니다.
반환 값: 각 Promise의 상태(status: 'fulfilled' 또는 'rejected')와 결과(value 또는 reason)를 담은 객체 배열을 반환합니다.

const promise1 = Promise.resolve('Success');
const promise2 = new Promise((resolve, reject) => {
  setTimeout(() => reject('Error!'), 100);
});

Promise.allSettled([promise1, promise2]).then((results) => {
  console.log(results);
  /*
  [
    { status: 'fulfilled', value: 'Success' },
    { status: 'rejected', reason: 'Error!' }
  ]
  */
});

Promise.race()

**Promise.race()**는 여러 Promise 중 가장 먼저 완료된 Promise의 결과를 반환합니다. 먼저 완료된 Promise가 성공하면 성공 값을, 실패하면 오류 값을 반환합니다.
반환 값: 가장 먼저 완료된 Promise의 결과 값 또는 오류를 반환합니다.

const promise1 = new Promise((resolve, reject) => {
  setTimeout(resolve, 500, '첫 번째 완료!');
});

const promise2 = new Promise((resolve, reject) => {
  setTimeout(reject, 100, '두 번째 실패!');
});

Promise.race([promise1, promise2]).then((value) => {
  console.log(value);
}).catch(error => {
  console.error(error); // "두 번째 실패!" 가 출력됩니다.
});

Promise.any()

**Promise.any()**는 가장 먼저 성공적으로 완료된 Promise의 결과를 반환합니다. 만약 모든 Promise가 실패하면 AggregateError를 반환합니다.
반환 값: 가장 먼저 성공한 Promise의 결과 값을 반환합니다.

const promise1 = new Promise((resolve, reject) => {
  setTimeout(reject, 500, '첫 번째 실패');
});

const promise2 = new Promise((resolve, reject) => {
  setTimeout(resolve, 100, '두 번째 성공!');
});

Promise.any([promise1, promise2]).then((value) => {
  console.log(value); // "두 번째 성공!"
}).catch(error => {
  console.error(error);
});

**Promise.all()**과 **Promise.any()**는 비슷해 보이지만, **Promise.all()**은 모든 성공을 기다리는 반면, **Promise.any()**는 첫 번째 성공만을 기다린다는 점에서 차이가 있습니다.