JavaScript에서 setInterval 사용에 대한 자세한 설명

黄舟
풀어 주다: 2017-11-24 09:57:03
원래의
2356명이 탐색했습니다.

JavaScript의 setInterval 기능은 애니메이션 재생 시 일정 간격으로 함수나 메소드, 객체를 호출하는 것이라는 사실은 많은 분들이 알고 계시리라 믿습니다. setInterval의 정의만 알고 거의 이해하지 못하는 친구들도 많습니다. . 오늘은 JavaScript에서 setInterval의 사용법을 자세히 소개하겠습니다!

setInterval 액션의 구문 형식은 다음과 같습니다.


setInterval(function,interval[,arg1,arg2,......argn])
setInterval(object,methodName,interval[,arg1,arg2,.....argn])
로그인 후 복사

첫 번째 형식은 표준 액션 패널에 있는 setInterval 함수의 기본 구문이고, 두 번째 형식은 전문가 모드 액션에서 사용되는 방법입니다.

매개변수 함수는 함수 이름이거나
익명 함수에 대한 참조입니다. object 매개변수는 Object object에서 파생된 개체를 지정합니다. methodName은 객체 매개변수에서 호출될 메소드를 지정합니다. interval은 함수 또는 methodName에 대한 두 호출 사이의 시간을 밀리초 단위로 지정합니다. 다음 arg1 등은 함수 또는 methodName에 전달되는 매개변수를 지정하는 데 사용되는 선택적 매개변수입니다.
setInterval 설정한 시간 간격이 애니메이션 프레임 속도(예: 초당 10프레임, 100밀리초와 동일)보다 작으면 해당 간격에 최대한 가까운 시간 간격으로 함수가 호출됩니다.
그리고 화면이 충분한 빈도로 새로 고쳐지도록 하려면 updateAfterEvent 작업을 사용해야 합니다. 간격이 애니메이션 프레임 속도보다 큰 경우 각 화면 새로 고침의 영향을 줄이기 위해 재생 헤드가 특정 프레임에 들어갈 때마다 호출됩니다.
아래 예시에서는 1초마다 익명 함수를 호출합니다.

setInterval(function(){trace("每隔1秒钟我就会显示一次")},1000);//这里的function(){}是没有函数名的函数。成为匿名函数,后面的1000是时间间隔,单位是毫秒。
로그인 후 복사

다음 예에서는 매개변수를 사용하여 실행하는 방법을 보여줍니다.


function show1(){
    trace("每隔1秒显示一次");
}
function show2(str){
    trace(str);
}
setInterval(show1,1000);
로그인 후 복사

setInterval(show2,2000,"2초마다 표시하겠습니다"); 함수의 setInterval 메소드는 위에서 소개되었습니다.

아래에서는 객체의 setInterval 메소드를 소개하겠습니다.
먼저 액션에서 객체의 setInterval 메소드를 호출하는 예제를 작성합니다. 이 예제에서는 매개변수 전달이 필요하지 않습니다.

myobj=new Object();//创建一个新的对象
myobj.interval=function){
    trace("每隔1秒显示一次");
}//创建对象的方法。
setInterval(myobj,"interval",1000);//设定时间间隔调用对象的方法。
로그인 후 복사

다음으로 매개변수 전달 방법을 소개하겠습니다. 사실 원리는 함수의 매개변수 전달과 같습니다.


myobj=new Object();
myobj.interval-function(str){
    trace(str);
}
setInterval(myobj,"interval",2000," 每隔2秒我就会显示一次");
로그인 후 복사

주의하세요. 개체에 대해 정의된 메서드를 호출하려면 전문가 모드에서 두 번째 구문 형식을 사용해야 합니다.

이 경우에는 시간을 동적으로 표시하는 화면을 만들어 보겠습니다. 이는 다음 코드를 사용하여 달성할 수 있습니다.

setInterval(show,1000);
function show(){
    time=new Date();
    hour=time.getHours();
       minu=time.getMinutes();
       sec=time.get.Seconds();
    datetime=hour+":"+minu+":"+sec;
}//这里的datetime是一个动态文本框的变量名字。
로그인 후 복사

이렇게 보면 다들 setInterval 메소드를 잘 배웠어야 했는데요. 이제 ClearInterval 액션의 함수는 setInterval 함수에 대한 호출을 지우는 것입니다. 해당 구문은 다음과 같습니다.clearInterval(intervalid);

다음은 간단한 예입니다.

function show(){
    trace("每隔一秒显示一次");
}
var sh;
sh=setInterval(show,1000);
clearInterval(sh);
로그인 후 복사

요약: 이 글의 자세한 연구를 통해 JavaScript의 setInterval 사용법을 더 잘 이해할 수 있을 것이라고 믿습니다. 작업에 도움이 되길 바랍니다!

관련 권장사항:

JS SetInterval 페이지 폴링 튜토리얼 구현 방법

js의 setInterval 및 setTimeout 사용 예

js 간격 카운트다운을 실현하세요

JS는 예약된 작업을 구현하고 백그라운드 setInterval 타이밍을 요청하며 Ajax는 N초마다 요청합니다

위 내용은 JavaScript에서 setInterval 사용에 대한 자세한 설명의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿