Javascript_javascript 기술에서 setTimeOut 및 setInterval의 타이머 사용

Javascript의 setTimeOut 및 setInterval 함수는 지연되고 예약된 작업을 처리하는 데 널리 사용됩니다. 예를 들어 일정 시간 동안 웹 페이지를 연 후 로그인 상자가 나타나고 페이지는 비동기 요청을 보냅니다. 정기적으로 최신 데이터 등 그러나 그들의 적용은 다릅니다.

setTimeout() 메서드는 지정된 밀리초 후에 함수나 계산된 표현식을 호출하는 데 사용되는 반면, setInterval()은 ClearInterval이 지울 때까지 지정된 밀리초마다 함수나 표현식을 호출하기 위해 루프를 반복합니다. 즉, setTimeout()은 한 번만 실행되고, setInterval()은 여러 번 실행될 수 있습니다. 두 함수의 매개변수도 동일합니다. 첫 번째 매개변수는 실행될 코드 또는 핸들이고, 두 번째 매개변수는 지연할 시간(밀리초)입니다.
setTimeOut 사용법
setTimeout 함수의 사용법은 다음과 같습니다.

코드 복사 코드는 다음과 같습니다.

var timeoutID = window.setTimeout(func, [delay, param1, param2, ...])
var timeoutID = window.setTimeout(code, [delay])

timeoutID: 타이머 ID 번호.clearTimeout() 함수에서 타이머를 지우는 데 사용할 수 있습니다.
func: 실행 중인 함수.
code: (대체 구문) 실행될 코드 문자열입니다.
지연: 지연 시간(밀리초)입니다. 지정하지 않으면 기본값은 0입니다.

window.setTimeout 또는 setTimeout을 사용할 수 있습니다. 두 가지 쓰기 방법은 window.setTimeout이 전역 창 개체의 속성으로 setTimeout 함수를 참조한다는 점을 제외하면 기본적으로 동일합니다.

적용예시 :

코드 복사 코드는 다음과 같습니다.

함수 시간 초과(){
Document.getElementById('res').innerHTML=Math.floor(Math.random()*100 1)
}
setTimeout("timeout()",5000)

코드가 실행되면 5초 후에 timeout() 함수가 호출됩니다. 데모를 보려면 클릭하세요.
setInterval 사용법
setInterval 함수의 매개변수 및 사용법은 위의 setTimeout 함수 사용법 소개를 참조하세요. 차이점은 setInterval이 정기적으로 func 또는 코드 코드를 실행한다는 것입니다.
적용 예:

코드 복사 코드는 다음과 같습니다.

var tt = 10
함수 timego(){
ㅜㅜ--
Document.getElementById("tt").innerHTML = tt; If(tt==0){
           window.location.href='/'
         거짓 반환
}
}
var 타이머 = window.setInterval("timego()",1000)

timego() 함수는 페이지 요소 #tt가 표시하는 콘텐츠를 정의합니다. tt가 0이면 페이지가 홈 페이지로 이동합니다. 그런 다음 타이머 타이머를 정의하고 setInterval()을 사용하여 1초마다 timego()를 호출합니다. 이런 식으로 timego는 10번 실행되며, 매번 tt는 0이 될 때까지 1씩 감소합니다. 그런 다음 타이머를 중지하려면 다음 코드를 사용할 수 있습니다.

코드 복사 코드는 다음과 같습니다.

window.clearInterval(타이머)

코드가 실행되면 10초 후에 페이지가 홈페이지로 이동합니다

실제로 setTimeout()도 일정한 간격으로 함수를 반복적으로 실행할 수 있지만 우리는 여전히 단순히 setTimeOut과 setInterval을 다르게 사용합니다. 또한 JavaScript는 단일 스레드 방식으로 브라우저의 JavaScript 엔진에서 실행됩니다. 실제 응용 프로그램에서는 실행을 위해 복잡한 작업을 대기열에 넣어야 하므로 대규모 응용 프로그램에서는 이 문제를 고려해야 합니다. 기사는 깊은 연구를 수행하지 않습니다.

위 내용은 이 글의 전체 내용입니다. 모두 마음에 드셨으면 좋겠습니다.