JavaScript에서 주기적으로 함수를 호출하는 방법이 있습니까?


답변:


214

당신이 원하는 setInterval():

var intervalID = setInterval(function(){alert("Interval reached");}, 5000);

setInterval () 의 첫 번째 매개 변수는 평가할 코드 문자열 일 수도 있습니다.

다음을 사용하여 주기적 기능을 지울 수 있습니다.

clearInterval(intervalID);

15
나는 당신이 setInterval에 문자열 인수를 사용하고 있기 때문에 upvote하고 내 upvote를 철회하기로 결정했다. 효율성, 보안 및 닫기 기능을 위해 문자열 인수를 선호하는 함수는 거의 항상 사용되어야합니다.
— Jason S

5
괜찮아, 난 상관 없어 setInterval()매개 변수에 관계없이 질문에 대한 정답입니다. 이것은 단지 예일 뿐이며 두 방법 모두 정의상 정확합니다.
— zombat

2
Jason S에 동의합니다. 실제로 함수 여야합니다. 귀하의 예에서 유일한 문제는 무시할만한 성능 손실이지만, 나쁜 습관은 아닙니다.
— Matthew Crumley

4
나는 기능을 사용하는 것이 좋습니다. 나는 그렇지 않다고 결코 말하지 않았다. 어느 쪽이든 맞지만 주석을 위해 대신 함수를 포함하도록 답변을 편집합니다.
— zombat

37

하여 setInterval ()는 종종주기적인 실행을위한 최적의 솔루션 아님을 유의하시기 바랍니다 - 그것은 정말 당신이 실제로 정기적으로 전화하는거야 자바 스크립트에 따라 달라집니다.

예. 1000ms의 기간으로 setInterval ()을 사용하고 주기적 함수에서 때로는 2 초가 걸리는 아약스 호출을하면 첫 번째 응답이 다시 발생하기 전에 다른 아약스 호출을합니다. 이것은 일반적으로 바람직하지 않습니다.

많은 라이브러리에는 Nelson이 제공 한 프로토 타입 예제와 같이 setInterval을 순진하게 사용하는 함정을 방지하는주기적인 방법이 있습니다.

jQuery ajax 호출이 포함 된 함수를 사용하여보다 강력한주기적인 실행을 달성하려면 다음과 같이 고려하십시오.

function myPeriodicMethod() {
  $.ajax({
    url: ..., 
    success: function(data) {
      ...
    },
    complete: function() {
      // schedule the next request *only* when the current one is complete:
      setTimeout(myPeriodicMethod, 1000);
    }
  });
}

// schedule the first invocation:
setTimeout(myPeriodicMethod, 1000);

또 다른 방법은 setTimeout을 사용하지만 변수에서 경과 시간을 추적 한 다음 각 호출에서 시간 초과 지연을 동적으로 설정하여 가능한 한 원하는 간격에 가깝게 함수를 실행하지만 응답을 다시 얻을 수있는 것보다 빠르지는 않습니다.


setTimeout (myPeriodicMethod, 1000); 2 회 호출됩니다. 필요한가요? 내가 설정 시간 밖으로 만 완전한 기능을 호출해야한다고 생각
— Vishnudev K

1
예, 두 번째 setTimeout ()은 요구 사항이 아닙니다. 첫 번째 아약스 호출을 즉시 수행하는 myPeriodicMethod ()를 호출 할 수 있습니다. 그러나 첫 번째 호출에서 지연 으로 예약하려면 다음 과 같이 쓸 수 있습니다. 나는 썼다.
— Matt Coubrough

16

모든 사람은 이미 setTimeout / setInterval 솔루션을 가지고 있습니다. 문자열뿐만 아니라 setInterval에 함수를 전달할 수 있다는 점에 유의해야한다고 생각합니다. 실제로는 해당 함수에 "평가"될 문자열 대신 실제 함수를 전달하는 "약간"일 것입니다.

// example 1
function test() {
  alert('called');
}
var interval = setInterval(test, 10000);

또는:

// example 2
var counter = 0;
var interval = setInterval(function() { alert("#"+counter++); }, 5000);

3
+1 Crockford JavaScript School 학생이라면 악한 형태의 평가를 피할 수 있습니다.
— Patrick McElhaney

@ 패트릭- "이름에 $ (달러 기호) 또는 \ (백 슬래시)를 사용하지 마십시오"제안은 jQuery 로트와 잘 어울릴 것이라고 생각하지 않습니다 :)
— Russ Cam

6

오래된 질문이지만 .. 나는 또한 정기적 인 작업 주자가 필요했고 TaskTimer을 썼습니다 . 다른 간격으로 여러 작업을 실행해야 할 때도 유용합니다.

// Timer with 1000ms (1 second) base interval resolution.
var timer = new TaskTimer(1000)

// Add task(s) based on tick intervals.
timer.addTask({
    name: 'job1',       // unique name of the task
    tickInterval: 5,    // run every 5 ticks (5 x interval = 5000 ms)
    totalRuns: 10,      // run 10 times only. (set to 0 for unlimited times)
    callback: function (task) {
        // code to be executed on each run
        console.log(task.name + ' task has run ' + task.currentRuns + ' times.');
    }
});

// Start the timer
timer.start();

TaskTimer브라우저와 노드 모두에서 작동합니다. 모든 기능에 대한 설명서 를 참조하십시오 .




2
function test() {
 alert('called!');
}
var id = setInterval('test();', 10000); //call test every 10 seconds.
function stop() { // call this to stop your interval.
   clearInterval(id);
}


1

기본 방법은 실제로 setInterval()/ clearInterval()이지만 이미 프로토 타입 라이브러리를 사용중인 경우 PeriodicalExecutor를 활용할 수 있습니다.

new PeriodicalUpdator(myEvent, seconds);

이렇게하면 통화가 겹치지 않습니다. 에서 http://www.prototypejs.org/api/periodicalExecuter :

"실행하는 데 지정된 간격보다 오래 걸리면 콜백 함수의 여러 병렬 실행을 방지합니다 (콜백 함수의 예외에 대해 차폐 된 내부"실행 "플래그를 유지합니다). 이는 특히 유용한 경우입니다. 하나를 사용하여 지정된 간격으로 사용자와 상호 작용합니다 (예 : 프롬프트 사용 또는 전화 확인). 이렇게하면 여러 메시지 상자가 모두 동작하기를 기다리는 것을 방지 할 수 있습니다. "

당사 사이트를 사용함과 동시에 당사의 쿠키 정책과 개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.