Promise의 resolve()와 fulfilled에 대해서

A

resolve()는 pending 상태인 promise를 완료 상태로 변경하는 함수이고,

fulfilled는 resolve()에 의해 promise가 완료된 상태를 의미합니다.

 

promise는 대기 상태인 pending, 성공 상태인 fulfilled, 실패 상태인 rejected 3가지의 상태가 존재합니다.

 

promise가 생성될 때, resolve와 reject를 인자로 받는 콜백함수를 실행하며 비동기 작업이 진행됩니다.

비동기 처리 성공 후 resolve를 호출되면 fulfilled 상태가 되고, 비동기 처리가 실패 시 reject를 호출해 rejected 상태가 됩니다.

 

fulfilled가 된 promise는 then()에서 값을 받게 되고, rejected가 된 promise는 catch()에서 에러를 처리합니다.

 

Q resolve 에서 작업이 실패할 수도 있나요?

resolve는 promise를 fulfilled로 변경하고, 성공한 값을 전달하는 역할만을 하는 함수로, resolve 자체에서 실패하는 상황은 발생하지 않습니다.

 

Q Promise가 fulfilled 상태가 되었을 때, 후속 처리를 위해 .then()을 사용하는 것과 async/await를 사용하는 것의 차이점은 무엇인가요?

then과 async/await의 차이점은 코드 스타일 차이로 인한 직관성 차이입니다.

 

promise는 fulfilled 상태가 되었을때, resolve()를 호출하며 전달하는 값을 then의 인자로 전달합니다.

후속 처리 메소드 또한 promise를 반환하며 여러개의 then 을 체이닝하며 사용할 수 있습니다.

 

async/await은 Promise를 직관적이고, 간결하게 사용할 수 있도록 하는 문법적 설탕입니다.

promise가 settled 상태가 될때까지 기다리고, 그 결과를 반환하여, 코드 흐름이 동기 코드처럼 보이게 되어 가독성이 높아집니다.

 

Q async/await을 사용하면 resolve()와 reject()의 동작이 어떻게 바뀌는지 설명해주실 수 있나요?

async/await을 사용하면, resovle, reject를 호출한 결과를 동기처럼 반환하여 처리할 수 있게 됩니다.

 

await 키워드를 사용하면, promise가 완료될때까지 대기합니다.

promise가 settled 상태가 될때까지 대기 후, 비동기 작업이 성공하면 resolve()를 반환합니다.

만약 비동기 작업이 실패하면 reject()를 반환하여 try/catch에서 catch 로 빠지게 됩니다.

 

Q Promise.all()과 async/await의 차이점은 무엇인가요?

promise를 병렬 처리와 실행 순서 보장이 다릅니다

 

Promise.all은 여러개의 promise를 인자로 전달받아 병렬 처리합니다. 

모든 promise가 fulfilled 될때까지 기다리고, 전달한 순서대로 fulfilled 된 결과를 받아 하나의 배열로 반환하게 됩니다.

 

반면 async/await은 await 키워드가 있는 위치에서 promise가 settled 되기 전까지 다음 코드를 실행하지 않기 때문에 병렬 처리가 어렵지만, 실행되는 순서를 보장할 수 있습니다.

 

추가 공부 자료

Promise.all([ ])

• 병렬 처리
• 모두 fulfilled 시 종료 ( 가장 오래 걸리는 시간 + a 소요)
• 처리 결과를 전달한 promise 순서대로 저장
• 하나라도 rejected 시 종료

 

Promise.race([ ])

• 가장 먼저 fulfilled 되는 promise 반환
• 하나라도 rejected 시 종료

 

Promise.allSettled([ ])

• 모두 settled 시 종료 (fulfilled, rejected 모두 저장
• 처리 결과를 전달한 promise 순서대로 저장

const p1 = Promise.resolve("✅ 성공 1");
const p2 = new Promise((resolve) => setTimeout(resolve, 2000, "✅ 성공 2"));
const p3 = Promise.reject("❌ 실패");

Promise.allSettled([p1, p2, p3]).then(results => {
    console.log(results);
});