SetInterval and SetTimeout

Both functions are timers, which are functions of the Window object, but there are many differences.

1. Fundamental differences

SetTimeout ("function", time), function name or code, time unit millisecond, refers to the delay of a specified period after loading to execute the function once .

Setinteval ("function", interval), which is performed once every specified time after loading.

2.setTimeout Loop Call

SetTimeout can be written in a function and then specified as this external function, to achieve the effect of cyclic delay execution, similar to setinterval.

functionmovepic (Nowid, NextID, direction) { Now= document.getElementById (nowid+ ""); Next= document.getElementById (nextid+ ""); //to prevent the pull caused by frequent quick calls (such as a quick mouse movement), each time it accumulates the event cleanup in the settimeout queue;    if(pic.movement) {cleartimeout (pic.movement); }                    varNowleft =parseint (Now.style.left); varNextleft =parseint (Next.style.left); varDist = 0; if(direction) {varNowtoleft =-800; }    Else{        varNowtoleft = 800; }    if(Nowleft = =nowtoleft) {return true; return function when equal, stop loop call}Else if(Nowleft >nowtoleft) {Dist= Math.ceil ((nowleft-nowtoleft)/20);//variable motion Nowleft-=Dist; Nextleft-=Dist; }    Else{Dist= Math.ceil ((nowtoleft-nowleft)/20);//variable motion Nowleft + =Dist; Nextleft+=Dist; } now.style.left= nowleft+ ' px '; Next.style.left= nextleft+ ' px '; varrepeat = "movepic ('" +nowid+ "', '" +nextid+ "'," +direction+ ")"; //setting the movement to a global variable causes the error to be "cleared" at the beginning of the above, if it is set to a local variable,    //The local variable does not exist in the context of the cleartimeout function, so that it does not work properly;    //so set the property to a variable;Pic.movement = This. SetTimeout (Repeat, 1);}

Here are a few features:

Logic can be used to specify when to stop the loop, through the return mode;

SetInterval is called every fixed time, regardless of whether or not the previous completion, and this settimeout way can guarantee that the previous function after the completion of the timer delay call.

3.clearTimeout and Clearinterval

Clearinterval can make the timing cycle stop, while the cleartimeout is generally the same as the above comments, clear accumulation queue, avoid pulling.

To be clear, assign the timer function to a variable, and the variable is different:

SetInterval can be directly assigned to a global variable, there is no problem;

When using settimeout in a nested loop, it is important to note that this variable is set to a global variable which causes the error "No setting is cleared" above, and if it is set to a local variable, the local variable does not exist in the context of the cleartimeout function so that it does not work properly; , it is generally used as the property of the object being manipulated, and when it is first cleared, the property exists before it is cleared.

SetInterval and SetTimeout