[javascript] 프로미스를 사용한 타이머 및 인터벌 처리 방법

07 Dec 2023

javascript

자바스크립트에서 타이머를 다루는 방법에는 여러 가지가 있지만, 프로미스를 활용하면 비동기 작업을 좀 더 간편하게 다룰 수 있습니다. 이번 포스트에서는 프로미스를 사용하여 타이머와 인터벌을 처리하는 방법을 알아보겠습니다.

1. 타이머

타이머는 특정 시간 후에 비동기 작업을 실행할 수 있는 기능입니다. 자바스크립트에서는 setTimeout 함수를 사용하여 타이머를 생성할 수 있습니다. 그러나 setTimeout 함수는 콜백 형태로 동작하므로 코드의 복잡성을 증가시킬 수 있습니다. 이를 해결하기 위해 프로미스를 사용하여 타이머를 처리할 수 있습니다.

아래는 프로미스를 사용하여 타이머를 처리하는 예시입니다.

function delay(ms) {
  return new Promise((resolve) => {
    setTimeout(resolve, ms);
  });
}

delay(2000).then(() => {
  console.log('2초 후에 실행됩니다.');
});

위 코드에서는 delay 함수를 정의하여 타이머를 생성합니다. 이 함수는 setTimeout을 사용하여 지정된 시간(여기서는 2000ms) 후에 프로미스를 해결(resolve)합니다. 그리고 타이머가 끝난 후에 실행할 작업을 then 메소드로 등록합니다.

2. 인터벌

인터벌은 일정한 시간 간격으로 반복적인 작업을 수행하는 기능입니다. 자바스크립트에서는 setInterval 함수를 사용하여 인터벌을 생성할 수 있습니다. 그러나 setInterval 함수도 콜백 형태로 동작하므로 코드의 복잡성을 증가시킬 수 있습니다. 이를 프로미스를 사용하여 처리할 수 있습니다.

아래는 프로미스를 사용하여 인터벌을 처리하는 예시입니다.

function interval(ms) {
  return new Promise((resolve) => {
    setInterval(resolve, ms);
  });
}

interval(1000).then(() => {
  console.log('1초마다 실행됩니다.');
});

위 코드에서는 interval 함수를 정의하여 인터벌을 생성합니다. 이 함수는 setInterval을 사용하여 지정된 시간(여기서는 1000ms)마다 프로미스를 해결(resolve)합니다. 그리고 인터벌이 멈추는 시점에 실행할 작업을 then 메소드로 등록합니다.

결론

이번 포스트에서는 프로미스를 사용하여 자바스크립트에서 타이머와 인터벌을 처리하는 방법을 알아보았습니다. 프로미스를 활용하면 콜백 형태로 구현한 타이머 및 인터벌 코드보다 가독성이 좋아지고 비동기 작업을 더 간편하게 다룰 수 있습니다. 프로미스를 사용하여 타이머와 인터벌을 처리하는 방법은 자바스크립트 개발자에게 유용한 기술 중 하나입니다.

참고 자료: