반응형

Promise에 대한 내용입니다.

Promise는 비동기 작업의 최종 완료 또는 실패와 그 결과 값을 나타내는 자바스크립트의 개체입니다.

비동기 코드 작업을 위한 보다 구조화되고 관리 가능한 방법을 제공하기 위해 프로미스가 도입되었습니다.

일반적으로 원격 서버에서 데이터 가져오기, 파일 읽기 또는 타이머 처리와 같이 완료하는데 다소 시간이 걸릴 수 있는 작업에 사용됩니다.

 

Promise에는 3가지 상태가 있습니다.

  1. Pending: 초기 상태입니다. 이는 비동기 작업이 계속 진행중이며, 아직 값이나 오류가 해결되지 않았음을 나타냅니다.
  2. Fulfilled ( Resolved ): 비동기 작업이  성공적으로 완료되었을 때 Promise의 상태입니다. 결과 값을 전달합니다.
  3. Rejected: 비동기 작업에 오류가 발생하거나 실패했을 때 Promise의 상태입니다. 실패 내용을 담고 있습니다.

Promise는 비동기 작업이 성공되거나 실패 했을때 발생해야 하는 작업을 정의하기 위해 .then().catch() 메서드와 함께 사용됩니다.

프로미스는 비동기 작업을 처리하는 구조화된 방법을 제공하며 콜백 지옥 또는 pyramid of doom를 피하는데 도움이 됩니다.

 

자바스크립트에서 프로미스를 사용하는 방법에 대한 예

const fetchData = new Promise((resolve, reject) => {
    // API에서 데이터를 가져왔다고 가정하기 위한 내용입니다.
    setTimeout(() => {
        const data = { message: "Data Fetch Successfully" };

        if (data) resolve(data);
        else reject("Fetch Fail");
    }, 2000);
});

fetchData
.then(data => {
    console.log("Success: ", data);
})
.catch(err => {
    console.log("Err: ", err);
})

위 내용은 아래와 같습니다.

  • setTimeout함수를 사용하여 비동기 작업을 시뮬레이션하는 fetchData Promise를 생성합니다. 지연 후 성공 메시지로 해결하거나 오류 메시지로 실패합니다.
  • .then()을 사용하여 프로미스가 이행( resolve )되었을때 성공 메시지를 보여줍니다.
  • 프로미스가 거절( reject )되었을 때 어떻게 처리할 것인지를 정의하기 위해서 .catch() 메서드를 사용해서 에러 메시지를 보여줍니다.

Promise는 비동기 연산을 처리하기 위한 보다 깨끗하고 구조화된 방법을 제공하며, 많은 자바스크립트 API 및 라이브러리의 기본 구성 요소입니다. 특히 Ajax 요청, 비동기 I/O 연산, 비동기 이벤트의 복잡한 흐름을 처리할 때 유용합니다. 프로미스는 자바스크립트 및 기타 프로그래밍 언어에서 비동기 코드를 관리하기 위한 기본 도구가 되었습니다.

반응형

+ Recent posts