setInterval과 setTimeout: 어느 것을 사용해야 합니까?

JavaScript로 작업해 본 적이 있다면 어느 시점에서 setInterval 및 setTimeout을 접한 적이 있을 것입니다. 이 두 가지 방법은 잠시 후 또는 특정 간격마다 작업을 수행할 시기를 코드에 알려주는 마법의 도구와 같습니다. 그러나 언제 하나를 사용해야 하고 다른 하나는 사용하지 않아야 합니까? ?

setTimeout과 setInterval이란 무엇입니까?

어떤 것을 사용할지 결정하기 전에 각각의 기능을 기억해 두는 것이 좋습니다.

setTimeout을 잠시 후에 울리는 알람이라고 상상해 보세요. 얼마나 기다려야 하는지 알려주면 펑, 기능이 실행됩니다. 그런데 딱 한 번만 해요.

  setTimeout(() => {
      console.log("¡Hola después de 2 segundos!");
  }, 2000);

여기, "안녕하세요!" 2초 후에 표시되고 종료되면 해당 기능은 반복되지 않습니다.

setInterval의 경우 끌 때까지 몇 분마다 계속 울리는 알람과 같습니다. 반복 사이에 기다려야 할 시간을 알려주면 중지하라고 말할 때까지 함수를 계속 실행합니다.

  setInterval(() => {
      console.log("¡Hola cada 2 segundos!");
  }, 2000);

이 경우 메시지는 ClearInterval 함수를 사용하여 간격을 중지할 때까지 2초마다 논스톱으로 표시됩니다.

언제 setTimeout을 사용해야 합니까?

setTimeout은 어떤 일이 즉시 발생하지 않고 한 번만 발생하기를 원할 때 가장 좋은 친구입니다. 매우 유용한 몇 가지 상황은 다음과 같습니다.

• 짧은 일시 중지: 애니메이션을 실행하기 전에 몇 초 정도 기다려야 할 수도 있고 애니메이션을 표시하기 전에 로드할 시간을 주고 싶을 수도 있습니다.

• 비동기 프로세스: 복잡한 작업에서 다음 단계로 진행하기 전에 잠시 기다려야 하는 경우가 있습니다.

따라서 무언가를 한 번 실행하기 전에 약간의 지연이 필요한 경우 setTimeout을 선택하세요.

그리고 setInterval은 어떻습니까?

setInterval은 똑딱거리는 시계처럼 반복적으로 발생해야 하는 일이 필요한 경우에 사용됩니다. 다음은 setInterval이 빛나는 몇 가지 예입니다.

• 시계 및 타이머: 매초 시간을 업데이트하는 시계 또는 카운트다운 타이머를 상상해 보세요.

• 지속적인 확인: 새 메시지, 업데이트가 있는지 또는 애플리케이션에 변경된 사항이 있는지 수시로 확인하세요.

• 실시간 업데이트: 몇 초마다 새로운 데이터로 페이지 콘텐츠를 새로 고칩니다.

어떤 일이 일정한 간격으로 계속 발생하는 것이 필요한 경우 setInterval이 바로 그 것입니다.

성능에 관한 몇 가지 사항

setTimeout과 setInterval 모두 완벽하지는 않다는 점을 언급하는 것이 중요합니다. 애플리케이션이 매우 바쁜 경우, 특히 동시에 많은 작업을 실행하는 경우 타이머가 지연될 수 있습니다. 그리고 setInterval에 주의하세요. 그 안에서 수행하는 작업이 설정한 간격보다 오래 걸리면 함수가 누적되기 시작할 수 있고, 이때부터 문제가 시작됩니다.

이를 방지하기 위해 일부 사람들은 setInterval 대신 setTimeout을 재귀적으로 사용하는 것을 선호합니다. 이렇게 하면 다음 함수가 실행될 때 더 효과적으로 제어할 수 있습니다.

function ejecutarCada2Segundos() {
    console.log("¡Hola cada 2 segundos!");
    setTimeout(ejecutarCada2Segundos, 2000);
}

ejecutarCada2Segundos();

그러나 setInterval을 사용하기로 결정한 경우 간격이 무한정 계속 실행되는 것을 방지하기 위해 간격을 중지하는 방법을 아는 것이 중요합니다. 여기서는clearInterval이 사용됩니다. 이 방법을 사용하면 활성 간격을 중지할 수 있습니다. 다음은 간단한 예입니다.

const intervalo = setInterval(() => {
    console.log("¡Hola cada 2 segundos!");
}, 2000);

// Detener el intervalo después de 10 segundos
setTimeout(() => {
    clearInterval(intervalo);
    console.log("Intervalo detenido");
}, 10000);

이 예에서는 "2초마다 안녕하세요!"라는 메시지가 표시됩니다. 10초 동안 반복됩니다. 그 이후에는 ClearInterval이 간격을 중지하며 콘솔에 "간격이 중지되었습니다"라는 메시지가 표시됩니다.

그럼 어느 것을 사용합니까?

간단히 말해서, 일정 시간이 지난 후 한 번만 어떤 일이 일어나도록 해야 한다면 setTimeout을 사용하는 것이 좋습니다. 그러나 무언가를 지속적으로 반복하려면 setInterval을 선택하십시오.

두 가지 모두 JavaScript의 강력한 도구이며 각각의 사용 시기를 알면 코드를 더욱 효율적이고 관리하기 쉽게 만들 수 있습니다.

위 내용은 setInterval과 setTimeout: 어느 것을 사용해야 합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!