자바스크립트의 Promise는 비동기 작업을 관리하고, 해당 작업의 성공 또는 실패 결과를 나중에 사용할 수 있도록 하는 객체입니다. 정리해서 말씀드려보자면, Promise는 비동기 작업의 완료 여부를 약속해주는 개념이라고 할 수 있습니다.

자바스크립트는 비동기 처리를 위한 콜백 함수를 많이 사용합니다. 하지만 콜백 함수는 코드가 복잡해짐에 따라 콜백이 중첩되는 "콜백 지옥" 문제를 야기할 수 있습니다. Promise는 이러한 비동기 처리의 가독성을 높이고, 코드의 흐름을 명확하게 관리할 수 있도록 도와주는 방식입니다.

Promise는 다음과 같은 3가지 상태를 가지는데요. 첫번째로는 비동기 작업이 아직 완료되지 않은 초기 상태를 나타내는 Pending, 두번째로는 비동기 작업이 성공적으로 완료되어 값을 반환한 상태인 Fulfilled, 그리고 마지막으로 비동기 작업이 실패하여 오류를 반환한 상태인 Rejected입니다.

Promise 객체는 비동기 작업을 수행할 함수를 인자로 받아서 실행하며, 이 함수는 resolve()와 reject()라는 두 가지 콜백을 받습니다.

resolve()는 비동기 작업이 성공했을 때 값을 전달하여 Promise를 fulfilled 상태로 전환하고, reject()는 비동기 작업이 실패했을 때 오류를 전달하여 Promise를 rejected 상태로 전환합니다.

Pending 상태에서 Fulfilled나 Rejected 상태로 전환되면, 이후에는 다른 상태로 전환되지 않으며, 그 결과 값을 통해 해당 작업의 성공 여부를 알 수 있습니다.

Promise는 코드의 가독성을 높이고, 비동기 작업의 흐름을 제어하는 데에 매우 유용합니다. 특히 여러 개의 Promise를 순차적으로 연결할 수도 있고 Promise.all() 이나 allSettled() 같은 메서드를 통해 병렬로 비동기 작업을 처리할 수도 있습니다.

그럼 Promise의 단점은 없나요? 🤔

Promise는 비동기 작업의 가독성을 높이는데에 도움이 되지만 크게 2가지의 단점이 있습니다.

첫번째로는 복잡한 에러 처리입니다.
Promise는 단일 체인에서는 에러 처리가 간단하지만, 여러 Promise가 중첩되거나 서로 다른 비동기 흐름에서 에러가 발생할 경우 복잡도가 증가할 수 있습니다. 예를 들어, then() 체인 내의 중간 단계에서 오류가 발생하면 catch 블록에서 이를 캐치할 수 있지만, 특정 단계에서만 발생하는 에러를 세밀하게 다루기가 어렵습니다. 따라서 비동기 흐름에서 발생하는 다양한 에러를 모두 처리하려면 코드가 복잡해질 수 있습니다.

두번째로는 콜백 지옥을 완전히 해결하지는 못한다는 점입니다.
Promise는 콜백 지옥 문제를 어느 정도 해결하지만, 비동기 작업이 복잡하게 중첩되면 여전히 콜백과 유사하게 여러 then() 메서드가 연속해서 사용되며 가독성이 떨어질 수 있습니다. 여러 Promise를 순차적으로 실행해야 할 때 then() 체인을 계속 사용하면 코드의 들여쓰기 구조가 복잡해지고 이해하기 어려워지는 문제점이 있습니다. 이는 async/await을 통해 개선할 수 있습니다.