[Javascript] 프로미스(Promise)란?

 

 

JavaScript Promise: 비동기 처리의 새로운 방식

 

서문

JavaScript에서 비동기 작업을 처리하는 데 있어 Promise는 현대적이고 효과적인 방법 중 하나입니다. 이 글에서는 Promise의 정의, 기본 문법, 간단한 예제부터 심화 예제까지 살펴보겠습니다.

1. Promise의 정의

Promise는 비동기 작업의 성공 또는 실패와 그 결과 값을 나타내는 객체입니다. 이 객체는 비동기 작업이 완료되면 이행(resolve) 또는 거부(reject) 상태로 변경됩니다. Promise는 콜백 지옥(callback hell)을 피하고 비동기 코드를 더 읽기 쉽게 만드는 도구 중 하나로 꼽힙니다.

2. Promise의 기본 문법

const myPromise = new Promise((resolve, reject) => {
  // 비동기 작업 수행
  const success = true;

  if (success) {
    resolve('성공했습니다!');
  } else {
    reject('실패했습니다.');
  }
});

위 코드에서 resolve는 작업이 성공한 경우, reject는 작업이 실패한 경우를 나타냅니다.

3. 간단한 예제

function fetchData() {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      const success = true;
      if (success) {
        resolve('데이터를 성공적으로 가져왔습니다.');
      } else {
        reject('데이터를 가져오는데 실패했습니다.');
      }
    }, 1000);
  });
}

fetchData()
  .then(result => console.log(result))
  .catch(error => console.error(error));

위 코드에서 fetchData 함수는 비동기로 데이터를 가져오며, then과 catch 메서드를 사용하여 성공과 실패를 처리합니다.

4. 심화 예제: 체이닝과 병렬 처리

function fetchUserData() {
  return new Promise(resolve => {
    setTimeout(() => {
      resolve({ username: 'user123', email: 'user123@email.com' });
    }, 1000);
  });
}

function fetchUserPosts(username) {
  return new Promise(resolve => {
    setTimeout(() => {
      resolve([`${username}의 포스트 1`, `${username}의 포스트 2`]);
    }, 1000);
  });
}

fetchUserData()
  .then(user => fetchUserPosts(user.username))
  .then(posts => console.log(posts))
  .catch(error => console.error(error));

위 예제에서 fetchUserData의 결과를 이용해 fetchUserPosts를 호출하고 결과를 출력하는 체이닝이 이루어지고 있습니다.

결론

Promise는 비동기 코드를 더 효과적으로 다룰 수 있게 해주는 강력한 도구입니다. 기본 문법부터 응용까지 숙지하면 비동기 작업을 더욱 효율적으로 다룰 수 있을 것입니다. JavaScript에서 비동기 작업을 다루어야 할 때 Promise를 적극적으로 활용해보세요.