js setTimeout与setInterval使用实例及区别讲解

1.setTimeout与setInterval的区别

　　setTimeout：

　　　　1.直接使用的话，按照指定 的时间，只执行一次传入的函数参数。

　　　　2.函数的终止使用clearTimeout。

　　setInterval：

　　　　1.直接使用的话，按照指定的时间，循环执行传入的函数参数
　　　　2.函数的终止使用clearInterval。

2.setTimeout与setInterval的用法

　　setsetTimeout：

　　　　1.直接使用：setsetTimeout(function(data){},1000,param1);

　　　　　　　使用时可以传入多个个参数，参数的作用如下。

　　　　　　　　　　1.code/function 必需。要调用一个代码串，也可以是一个函数。

　　　　　　　　　　2.’milliseconds 可选。执行或调用 code/function 需要等待的时间，以毫秒计。默认为 0。

　　　　　　　　　　3.param1, param2, ... 可选。 传给执行函数的其他参数（IE9 及其更早版本不支持该参数）。

　　　　2.使用变量调用，并终止setsetTimeout用法。

var myVar;
 
function myFunction() {
    myVar = setTimeout(function(){ alert("Hello") }, 3000);
}
 
function myStopFunction() {
    clearTimeout(myVar);
}

　　setInterval

　　　　1.直接使用：setInterval(function, milliseconds, param1, param2, ...);

　　　　　　　使用时可以传入多个个参数，参数的作用如下。

　　　　　　　　　　1.code/function 必需。要调用一个代码串，也可以是一个函数。

　　　　　　　　　　2.’milliseconds 可选。执行或调用 code/function 需要等待的时间，以毫秒计。默认为 0。

　　　　　　　　　　3.param1, param2, ... 可选。 传给执行函数的其他参数（IE9 及其更早版本不支持该参数）。

　　　　2.使用变量调用，并终止setInterval用法。

var myVar = setInterval(function(data){ }, 1000);
 
function myStopFunction() {
    clearInterval(myVar);
}

3.setTimeout实现setInterval功能并实现自我终止

var myVar,i=0;
 
function myFunction() {
    myVar = setTimeout(function(){ 
　　　　i++;
　　　　if(i>21){
　　　　　　myStopFunction

　　　　}else{

　　　　　　mayVar
　　　　}
　　}, 3000);

}
 
function myStopFunction() {
    clearTimeout(myVar);
}