Colin's Blog
자바스크립트 Promise 객체를 활용한 비동기 처리

비동기 처리는 웹 개발에서 매우 중요한 개념입니다. 일반적으로 비동기 처리를 위해 콜백 함수를 사용하지만, 이러한 방식은 콜백 지옥(callback hell)과 같은 문제를 야기할 수 있습니다.

자바스크립트 Promise 객체는 이러한 문제를 해결하고 비동기 처리를 더욱 간편하게 할 수 있게 해줍니다. Promise 객체는 비동기 작업의 결과를 나타내는 객체로, 작업이 완료되면 성공 또는 실패를 알려줍니다.

Promise 객체의 기본 구조

Promise 객체는 다음과 같은 세 가지 상태를 가질 수 있습니다.

Promise 객체는 일반적으로 다음과 같이 생성됩니다.

const myPromise = new Promise((resolve, reject) => {
  // 비동기 작업을 수행하는 코드
});

Promise 객체는 생성자 함수를 호출할 때 함수를 전달받는데, 이 함수는 두 개의 매개변수(resolve, reject)를 가지고 있습니다. 비동기 작업이 성공할 경우 resolve 함수를 호출하고, 실패할 경우 reject 함수를 호출합니다.

Promise 기반의 비동기 처리 예제

다음은 Promise 객체를 활용한 간단한 비동기 처리 예제입니다. 주어진 시간이 지나면 “Hello, Promise!” 문자열을 반환하는 함수를 작성해보겠습니다.

function sayHelloWithDelay(delay) {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      resolve("Hello, Promise!");
    }, delay);
  });
}

sayHelloWithDelay(2000)
  .then((result) => {
    console.log(result);
  })
  .catch((error) => {
    console.error(error);
  });

위의 코드에서는 sayHelloWithDelay 함수가 Promise 객체를 반환하도록 구현되어 있습니다. setTimeout 함수를 사용하여 지정된 시간이 지난 후에 resolve 함수를 호출합니다.

그리고 반환된 Promise 객체의 then 메서드를 사용하여 비동기 작업의 결과를 처리합니다. 작업이 성공한 경우에는 resolve 함수에 전달된 결과를 사용하여 처리하고, 실패한 경우에는 catch 메서드를 사용하여 에러를 처리합니다.

이렇게 Promise 객체를 사용하면 콜백 함수를 여러 번 중첩하지 않고도 비동기 작업을 간단하게 처리할 수 있습니다. Promise 객체를 통해 보다 깔끔하고 가독성이 좋은 코드를 작성할 수 있습니다.

결론

자바스크립트 Promise 객체를 활용하면 비동기 처리를 보다 쉽고 간편하게 할 수 있습니다. Promise 객체는 비동기 작업의 상태를 나타내는 객체로, 작업이 완료되면 성공 또는 실패를 알려줍니다. Promise 객체를 사용하면 콜백 지옥을 피하고 가독성이 좋은 코드를 작성할 수 있습니다.

© 2018 Colin. All rights reserved.