ES6(ECMAScript 2015) – 프로미스 – 1 – 프로미스 체이닝

ES6(ECMAScript 2015) – 프로미스 – 1 – 프로미스 체이닝

소제목: 프로미스 체이닝이란?

프로미스 체이닝은 ES6(ECMAScript 2015)에서 도입된 프로미스(Promise) 객체의 기능 중 하나로, 비동기 작업을 순차적으로 처리하고 결과를 연결하는 방법입니다.

예시를 통해 쉽게 이해해보겠습니다. 상상해보세요, 여러분이 맛있는 아이스크림 가게에서 아이스크림을 사려고 줄을 서 있습니다. 그런데, 두 가지 선택지가 있습니다. 첫 번째로, 초콜릿 아이스크림을 사고 싶으신 분은 먼저 주문을 하시고, 주문이 완료되면 다음에 누가 접수를 받아줄지를 알려드립니다. 그 다음에, 아이스크림이 완성되면 다음 단계로 넘어갑니다. 두 번째로, 그 시간에 다른 일을 처리하다가 주문이 완료되면 바로 알려드리는 방식입니다. 두 가지 선택 중 어떤 방식을 선택하시겠습니까?

프로미스 체이닝은 두 번째 방식과 유사합니다. 비동기 작업을 순차적으로 처리하고 결과를 연결해주는 개념입니다. 각각의 비동기 작업은 프로미스 객체를 반환하며, 이를 연결하여 원하는 작업을 수행할 수 있습니다.

소제목: 프로미스 체이닝 예시

다음은 프로미스 체이닝의 예시 코드입니다.

// 첫 번째 비동기 작업
function orderIceCream() {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      resolve('주문 완료'); // 주문이 완료되면 resolve 호출
    }, 2000);
  });
}

// 두 번째 비동기 작업
function makeIceCream(message) {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      resolve(`아이스크림 만들기: ${message}`);
    }, 2000);
  });
}

// 세 번째 비동기 작업
function serveIceCream(message) {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      resolve(`아이스크림 서빙: ${message}`);
    }, 2000);
  });
}

// 프로미스 체이닝
orderIceCream()
  .then((order) => {
    console.log(order);
    return makeIceCream(order);
  })
  .then((iceCream) => {
    console.log(iceCream);
    return serveIceCream(iceCream);
  })
  .then((servedIceCream) => {
    console.log(servedIceCream);
  })
  .catch((error) => {
    console.error(error);
  });

위의 코드에서 orderIceCream, makeIceCream, serveIceCream 함수는 각각 비동기 작업을 수행하고 프로미스를 반환합니다. orderIceCream 함수가 주문을 받은 후 makeIceCream 함수로 넘어가고, makeIceCream 함수가 아이스크림을 만든 후 serveIceCream 함수로 넘어갑니다. 이렇게 연결된 프로미스 체인은 각 단계의 작업이 완료될 때마다 다음 단계로 넘어가며, 마지막으로 servedIceCream 변수에 최종 결과가 담기게 됩니다.

소제목: 프로미스 체이닝 주의해야 할 점

프로미스 체이닝을 사용할 때 주의해야 할 몇 가지 점이 있습니다.

1. 각 단계에서 반드시 프로미스를 반환해야 합니다: 각 비동기 작업에서 resolve 또는 reject를 호출하여 프로미스를 반환해야 합니다. 그렇지 않으면 체인이 제대로 작동하지 않을 수 있습니다.

2. 에러 처리를 잊지 마세요: catch 메서드를 사용하여 프로미스 체인 전체에서 발생하는 에러를 처리할 수 있습니다. 각 단계에서도 catch를 사용하여 해당 단계에서 발생하는 에러를 처리하는 것이 좋습니다.

3. 비동기 작업의 순서를 유의하세요: 프로미스 체이닝은 각 작업이 순차적으로 실행되는 것을 보장합니다. 따라서 작업의 순서가 중요한 경우에는 체인의 구성을 신중하게 고려해야 합니다.

4. 중첩된 프로미스 체이닝을 피하세요: 너무 많은 중첩된 프로미스 체이닝은 코드를 복잡하게 만들 수 있으므로, 가능하면 비동기 작업을 모듈화하고 함수를 분리하여 가독성을 높이는 것이 좋습니다.

프로미스 체이닝을 적절하게 활용하면 비동기 작업을 간결하게 표현하고, 순차적인 처리를 보장할 수 있습니다.

이상으로 프로미스 체이닝에 대한 설명을 마치겠습니다. 프로미스 체이닝을 통해 비동기 작업을 연결하고 순차적으로 처리할 수 있으며, 코드의 가독성과 유지 보수성을 높일 수 있습니다. 자바스크립트에서 프로미스를 다룰 때는 체이닝을 적극적으로 활용해보세요!

[ES6(ECMAScript,2015),,프로미스,,1,,프로미스,체이닝]