Home > Article > Web Front-end > Detailed explanation of the use of setInterval in JavaScript
I believe many of you know that the function of setInterval in JavaScript is to call functions, methods or objects at certain intervals when playing animations. There are also many friends who only know the definition of setInterval. , also have little knowledge. Today we will introduce you to the detailed explanation of the use of setInterval in JavaScript!
The syntax format of the setInterval action is as follows:
setInterval(function,interval[,arg1,arg2,......argn]) setInterval(object,methodName,interval[,arg1,arg2,.....argn])
The first format is the default syntax of the setInterval function in the standard action panel, and the second format is used in expert mode actions. method.
The parameter function is a function name or a reference to an anonymous function. The object parameter specifies an object derived from the Object object. methodName specifies the method to be called in the object parameter.
interval specifies the time between two calls to function or methodName, in milliseconds. The following arg1 and so on are optional parameters, used to specify the parameters passed to function or methodName.
setInterval The time interval it sets is less than the animation frame rate (such as 10 frames per second, equivalent to 100 milliseconds), and the function is called at a time interval as close as possible to the interval.
And the updateAfterEvent action must be used to ensure that the screen is refreshed with sufficient frequency. If the interval is greater than the animation frame rate, it is only called every time the playhead enters a certain frame to reduce the impact of each screen refresh.
The following example calls an anonymous function every 1 second.
setInterval(function(){trace("每隔1秒钟我就会显示一次")},1000);//这里的function(){}是没有函数名的函数。成为匿名函数,后面的1000是时间间隔,单位是毫秒。
The following example shows us how to run it with parameters.
function show1(){ trace("每隔1秒显示一次"); } function show2(str){ trace(str); } setInterval(show1,1000);
setInterval(show2,2000,"I will display it every 2 seconds"); The setInterval method of the function has been introduced above.
Below we will introduce the setInterval method of the object.
First, write an example of calling the setInterval method of an object in an action. This example does not require passing parameters.
myobj=new Object();//创建一个新的对象 myobj.interval=function){ trace("每隔1秒显示一次"); }//创建对象的方法。 setInterval(myobj,"interval",1000);//设定时间间隔调用对象的方法。
Next, we will introduce how to pass parameters. In fact, the principle is the same as passing parameters of functions.
myobj=new Object(); myobj.interval-function(str){ trace(str); } setInterval(myobj,"interval",2000," 每隔2秒我就会显示一次");
Attention. When you want to call methods defined for an object, you must use the second syntax format in expert mode.
In this case, let’s make a screen that dynamically displays time. This can be achieved with the following code.
setInterval(show,1000); function show(){ time=new Date(); hour=time.getHours(); minu=time.getMinutes(); sec=time.get.Seconds(); datetime=hour+":"+minu+":"+sec; }//这里的datetime是一个动态文本框的变量名字。
In this case, everyone should learn the setInterval method very well. Now, we learn clearInterval.
The function of clearInterval action is to clear the call to setInterval function. Its syntax format is as follows clearInterval(intervalid); intervalid is the object returned after calling the setInterval function.
Here is a simple example.
function show(){ trace("每隔一秒显示一次"); } var sh; sh=setInterval(show,1000); clearInterval(sh);
Summary:
I believe that by studying this article in detail, I will learn more about the usage of setInterval in JavaScript. I hope it will be helpful to your work!
Related recommendations:
JS SetInterval How to implement page polling tutorial
Usage examples of setInterval and setTimeout in js
js uses setInterval to implement countdown
The above is the detailed content of Detailed explanation of the use of setInterval in JavaScript. For more information, please follow other related articles on the PHP Chinese website!