promise 사용

약속!!!

 

---

ㅁ Promise.all()

Promise.all([promiseA, promiseB])
  .then(results => {
    console.log('모든 프로미스 완료:', results);
  })
  .catch(error => {
    console.error('하나 이상의 프로미스 실패:', error);
  });

 

• 여러 프로미스를 병렬로 실행하고, 모두 완료될 때까지 기다림
• 사용 사례: 동시에 여러 API 요청을 하고, 모두 성공했을 때 결과를 처리해야 할 때 사용
• 주의점: 하나의 프로미스라도 실패하면 전체가 실패하며, catch()가 호출

 

---

ㅁ Promise.race()

Promise.race([promiseA, promiseB])
  .then(result => {
    console.log('가장 빠른 프로미스 완료:', result);
  })
  .catch(error => {
    console.error('가장 빠른 프로미스 실패:', error);
  });

• 전달된 프로미스 중 가장 먼저 완료되는 프로미스를 반환
• 사용 사례: 여러 비동기 작업 중 가장 빠른 응답을 얻고자 할 때 사용
• 주의점: 성공이든 실패든 가장 먼저 완료된 프로미스의 결과가 반환됨

---

ㅁ Promise.allSettled()

Promise.allSettled([promiseA, promiseB])
  .then(results => {
    results.forEach(result => {
      if (result.status === "fulfilled") {
        console.log('성공:', result.value);
      } else {
        console.error('실패:', result.reason);
      }
    });
  });

• 모든 프로미스가 성공하거나 실패할 때까지 기다린 후, 각각의 결과를 배열로 반환
• 사용 사례: 모든 프로미스의 결과를 확인해야 할 때 사용합니다. 성공과 실패 모두를 개별적으로 처리해야 할 때 유용
• 반환 결과: 성공한 프로미스는 {status: "fulfilled", value: ...}, 실패한 프로미스는 {status: "rejected", reason: ...} 형태로 반환

---

ㅁ Promise.any()

Promise.any([promiseA, promiseB])
  .then(result => {
    console.log('최초 성공한 프로미스:', result);
  })
  .catch(error => {
    console.error('모든 프로미스 실패:', error);
  });

• 전달된 프로미스 중 하나라도 성공하면 해당 결과를 반환합니다. 모든 프로미스가 실패해야만 catch()가 호출
• 사용 사례: 여러 요청 중 하나라도 성공하면 처리해야 할 때 유용
• 주의점: 최소 하나의 성공만 필요하며, 모두 실패해야만 에러를 반환함

---

ㅁ Promise.resolve()와 Promise.reject()

Promise.resolve('즉시 성공')
  .then(result => {
    console.log(result); // '즉시 성공'
  });

Promise.reject('즉시 실패')
  .catch(error => {
    console.error(error); // '즉시 실패'
  });

• 이미 완료된 프로미스를 생성
  • Promise.resolve(value)는 주어진 값을 성공한 프로미스로 감싸 반환
  • Promise.reject(error)는 주어진 이유로 실패한 프로미스를 반환
• 사용 사례: 테스트 시 즉시 이행하거나 실패하는 프로미스를 만들어야 할 때 사용

---

ㅁ async/await

async function fetchData() {
  try {
    const responseA = await promiseA;
    console.log('A 성공:', responseA);
    const responseB = await promiseB;
    console.log('B 성공:', responseB);
  } catch (error) {
    console.error('실패:', error);
  }
}

fetchData();

• async/await는 프로미스를 사용하는 비동기 코드를 동기 코드처럼 작성할 수 있게 해줌. await 키워드는 프로미스가 완료될 때까지 기다린 후 값을 반환함
• 가독성이 높아지고, 여러 비동기 작업을 순차적으로 처리하는 데 매우 유용
• 주의점: await은 반드시 async 함수 내에서 사용해야 힘.

---

ㅁ Promise chaining (프로미스 체이닝)

promiseA
  .then(resultA => {
    console.log('A 성공:', resultA);
    return promiseB;
  })
  .then(resultB => {
    console.log('B 성공:', resultB);
  })
  .catch(error => {
    console.error('실패:', error);
  });

• then()을 연쇄적으로 연결하여 여러 비동기 작업을 순차적으로 실행
• 사용 사례: 각 작업이 이전 작업의 결과에 의존할 때 유용
• 주의점: 하나의 프로미스라도 실패하면 전체가 실패하며, catch()가 호출됨

 

---

<요약>

 

• Promise.all(): 모든 프로미스가 완료될 때까지 기다림 (하나라도 실패하면 catch()).
• Promise.race(): 가장 먼저 완료된 프로미스의 결과 반환.
• Promise.allSettled(): 모든 프로미스가 완료된 후, 각각의 성공/실패 상태를 반환.
• Promise.any(): 하나라도 성공하면 결과 반환 (모두 실패해야 catch()).
• Promise.resolve() / Promise.reject(): 이미 완료된 프로미스를 생성.
• async/await: 비동기 코드를 동기처럼 작성하여 가독성을 높임.
• Promise chaining: 여러 비동기 작업을 순차적으로 연결하여 처리.