1，setTimeOut
复制代码
1
2
3
4ssetTimeout(要执行的代码, 等待的毫秒数) setTimeout(JavaScript 函数, 等待的毫秒数) //setTimeOut：设置超时时间，只会执行一次！
复制代码
1
2
3
4
5
6
7//等待3秒后执行语句 alert('等候完毕') setTimeout("alert('等候完毕')", 3000 ) setTimeout(function () { alert("hello"); }, 1000);
任务队列：
（1），JS是一个单线程序的解释器，一段时间内只能执行一段代码，因此就有了一个JS任务队列。这些任务会被按照它们添加到队列的顺序执行。如下：
复制代码
1
2
3
4
5
6
7
8
9function btn () { setTimeout(function () { for (let i=0; i<5; i++) console.log(i); },980); setTimeout(function () { console.log("2"); },1000) }
输出结果：
复制代码
1
2
3
4
5
6
70 1 2 3 4 2
（2），可以看出，如果队列是空的，则添加的代码会立即执行，否则，就要等前面的代码执行完后再执行。
看下面的例子：
复制代码
1
2
3
4
5
6
7function btn () { console.log(111); setTimeout(function () {console.log(222)}, 2000); setTimeout(function () {console.log(333)}, 0); console.log(444); }
输出结果：
复制代码
1
2
3
4
5111 444 333 222
即使设置时间为0，但它仍然要排队，直到函数中其它非延迟语句被执行完毕后才开始执行队列中的代码。所以“333”在“444”后面。
（3），取消调用：
setTimeout()会返回一个数值ID，这个ID为计划执行代码的唯一标识符，可以用它来取消超时调用。
取消尚未执行的超时调用计划，用clearTimeout()方法。如下：
复制代码
1
2
3
4var timeId = null; timeId = setTimeout(function () {alert("okok")}, 2000); clearTimeout(timeId);
任务并未执行便被取消。
2，setInterval
复制代码
1
2
3setInterval(函数名,延迟时间); //setInterval：设置一个间隔时间，间隔多久会触发一次！除非 clearInterval，否则会永久执行下去！
执行10次之后，间歇调用清空所有任务队列
复制代码
1
2
3
4
5
6
7
8
9
10
11
12
13
14var intervalId = null, num = 0, max = 10; function intervalHandler() { num++; if (num === max) { clearInterval(intervalId); alert("done"); } } intervalId = setInterval(intervalHandler, 500);
也可以使用setTimeout来写上面的函数
复制代码
1
2
3
4
5
6
7
8
9
10
11
12var num = 0, max = 10; function timeoutHendler() { num++; if (num < max) { setTimeout(timeoutHendler, 500); } else { alert("done"); } } setTimeout(timeoutHendler, 500);
3，Timer
复制代码
1
2
3Timer(延迟时间，执行次数); //Timer：设置一个间隔时间，有次数限制，只执行制定次数！
Java定时任务Timer调度器【三】 注意事项（任务精确性与内存泄漏
相关链接：
1，JS 中的定时器 setTimeout()
2，超时调用（setTimeout）和间歇调用(setInterval)
3，setTimeOut、setInterval、Timer 的区别和用法
最后
以上就是唠叨西牛最近收集整理的关于js 定时器使用 setTimeOut setInterval的全部内容，更多相关js内容请搜索靠谱客的其他文章。
本图文内容来源于网友提供，作为学习参考使用，或来自网络收集整理，版权属于原作者所有。
发表评论 取消回复