[js] promise란

아래는 `resolve`와 `reject`를 활용하는 간단한 Promise 예시입니다.

예시: 1부터 5까지의 숫자를 더하는 비동기 함수를 Promise로 구현합니다.

function addNumbersAsync() {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      const numbers = [1, 2, 3, 4, 5];
      const sum = numbers.reduce((acc, curr) => acc + curr, 0);
      resolve(sum); // 비동기 작업이 성공적으로 완료되면 결과를 resolve로 반환
      // reject(new Error('Something went wrong')); // 비동기 작업 중 오류가 발생하면 reject로 오류 반환
    }, 1000); // 1초 후에 작업 완료
  });
}

addNumbersAsync()
  .then(result => {
    console.log('Sum:', result); // 1부터 5까지의 합인 15가 출력됩니다.
  })
  .catch(error => {
    console.error('Error:', error.message); // 비동기 작업 중 오류가 발생한 경우 에러 메시지 출력
  });

위의 예시는 `addNumbersAsync` 함수를 Promise로 구현한 것입니다. 비동기적으로 1초 후에 1부터 5까지의 숫자를 더한 값을 resolve로 반환합니다. 이를 `.then` 메서드를 사용하여 성공적으로 처리한 결과를 출력하고, `.catch` 메서드를 사용하여 오류를 처리합니다. 만약 Promise 내에서 오류가 발생한다면 `reject`를 사용하여 오류를 반환할 수도 있습니다. 위 예시에서는 오류 처리 부분이 주석 처리되어 있습니다. 이 경우, 오류가 발생하지 않으므로 `then` 블록이 실행됩니다. 만약 오류 처리 부분을 활성화하고 `reject` 부분을 주석 해제한다면 `catch` 블록이 실행되어 오류 메시지가 출력됩니다.

 

화살표 함수를 사용하지 않으면 아래처럼 나타납니다.

function addNumbersAsync() {
  function sumNumbers() {
    const numbers = [1, 2, 3, 4, 5];
    const sum = numbers.reduce(function(acc, curr) {
      return acc + curr;
    }, 0);
    return sum;
  }

  return new Promise(function(resolve, reject) {
    setTimeout(function() {
      const sum = sumNumbers();
      resolve(sum); // 비동기 작업이 성공적으로 완료되면 결과를 resolve로 반환
      // reject(new Error('Something went wrong')); // 비동기 작업 중 오류가 발생하면 reject로 오류 반환
    }, 1000); // 1초 후에 작업 완료
  });
}

addNumbersAsync()
  .then(function(result) {
    console.log('Sum:', result); // 1부터 5까지의 합인 15가 출력됩니다.
  })
  .catch(function(error) {
    console.error('Error:', error.message); // 비동기 작업 중 오류가 발생한 경우 에러 메시지 출력
  });

위의 코드에서 `sumNumbers` 함수는 비동기 함수 `addNumbersAsync` 내에서 정의된 명명된 함수로서, 1부터 5까지의 숫자를 더하는 작업을 수행합니다. 이렇게 하여, 화살표 함수 또는 익명 함수 대신 명명된 함수를 사용하였습니다. 코드의 동작은 이전과 동일하며, 결과적으로 1초 후에 1부터 5까지의 숫자를 더한 결과가 출력됩니다. 오류 처리 부분도 주석 처리되어 있으니, 필요에 따라 오류를 테스트하고 확인해보시기 바랍니다.