js 定时器使用 setTimeOut setInterval

1，setTimeOut

ssetTimeout(要执行的代码, 等待的毫秒数)
setTimeout(JavaScript 函数, 等待的毫秒数)
//setTimeOut：设置超时时间，只会执行一次！ 

//等待3秒后执行语句  alert('等候完毕')
setTimeout("alert('等候完毕')", 3000 )

setTimeout(function () {
  alert("hello");
}, 1000);

任务队列：

（1），JS是一个单线程序的解释器，一段时间内只能执行一段代码，因此就有了一个JS任务队列。这些任务会被按照它们添加到队列的顺序执行。如下：

function btn () {
    setTimeout(function () {
        for (let i=0; i<5; i++) console.log(i);
    },980);
    setTimeout(function () {
        console.log("2");
    },1000)
}

输出结果：

0
1
2
3
4
2

（2），可以看出，如果队列是空的，则添加的代码会立即执行，否则，就要等前面的代码执行完后再执行。

看下面的例子：

function btn () {
    console.log(111);
    setTimeout(function () {console.log(222)}, 2000);
    setTimeout(function () {console.log(333)}, 0);
    console.log(444);
}

输出结果：

111
444
333
222

即使设置时间为0，但它仍然要排队，直到函数中其它非延迟语句被执行完毕后才开始执行队列中的代码。所以“333”在“444”后面。

（3），取消调用：

setTimeout()会返回一个数值ID，这个ID为计划执行代码的唯一标识符，可以用它来取消超时调用。

取消尚未执行的超时调用计划，用clearTimeout()方法。如下：

var timeId = null;
timeId = setTimeout(function () {alert("okok")}, 2000);
clearTimeout(timeId);

任务并未执行便被取消。

2，setInterval

setInterval(函数名,延迟时间); 
//setInterval：设置一个间隔时间，间隔多久会触发一次！除非 clearInterval，否则会永久执行下去！ 

执行10次之后，间歇调用清空所有任务队列

var intervalId = null,
    num = 0,
    max = 10;

function intervalHandler() {
    num++;
    if (num === max) {
        clearInterval(intervalId);
        alert("done");
    }
}
intervalId = setInterval(intervalHandler, 500);

也可以使用setTimeout来写上面的函数

var num = 0,
    max = 10;
function timeoutHendler() {
    num++;
    if (num < max) {
        setTimeout(timeoutHendler, 500);
    } else {
        alert("done");
    }
}
setTimeout(timeoutHendler, 500);

3，Timer

Timer(延迟时间，执行次数); 
//Timer：设置一个间隔时间，有次数限制，只执行制定次数！ 

Java定时任务Timer调度器【三】 注意事项（任务精确性与内存泄漏

相关链接：
1，JS 中的定时器 setTimeout()
2，超时调用（setTimeout）和间歇调用(setInterval)
3，setTimeOut、setInterval、Timer 的区别和用法

最后

以上就是唠叨西牛为你收集整理的js 定时器使用 setTimeOut setInterval的全部内容，希望文章能够帮你解决js 定时器使用 setTimeOut setInterval所遇到的程序开发问题。

如果觉得靠谱客网站的内容还不错，欢迎将靠谱客网站推荐给程序员好友。