Window.setTimeout和window.setInterval
概念:window.setTimeout()是一个定时器，在定时器到期后执行一个函数或者指定的一段代码。返回一个timerID。Window.setInterval()是一个间歇定时器，可以称为spacer。就是反复调用一个函数或者执行一个代码段，每次调用之间有固定的时间延迟。返回一个间隔。ClearTimeout和clearInterval可以分别清除定时器和间隔器，从而停止执行。
如何使用:
SetTimeout(表达式，延迟时间)
SetInterval(表达式，交互时间)
延迟时间/交互时间以秒为单位(1000毫秒= 1秒)。
两者的区别:
setTimeout()方法在等待指定时间后执行函数内容，只执行一次传入表达式。
setInterval()方法是每隔指定的时间间隔执行一次传入表达式，并循环直到窗口关闭或clearInterval()。
SetTimeout用于延迟执行:
设x = 1；
setTimeout(()= & gt；x++，0)；
console . log(x)；
如果控制台输出，也就是异步调用，你会得到2
SetInterval用于间隔执行:
设x = 1；
var interval 1 = setInterval(()= & gt；x++，1000)；
console . log(x)；
如果异步调用，会发现X每1秒增加1。
这里有一些例子。如果你能理解意思，你可以说它会被使用。
1.简单的例子
设a = 1；
let time rid = setTimeout(function(){
a++；
console.log(‘inner:’，a)；
},0);
console.log(‘outer:’，a)；
2.延期执行
设I = 0；
while(我& lt10) {
setTimeout(function() {
console.log(一)；
}, 1);
i++；
}
3.串行到并行执行
设data =[]；
for(设I = 0；我& lt= 999;i++) {
data[i] = {
number: Math.random()
}
};
对于(字母数据项){
console . time()；
setTimeout(function() {
item . number+= 1；
}, 0);
setTimeout(function() {
item . id = ‘ id:’+item . number；
}, 0);
console . time end()；
}
//当数据操作的步骤太复杂，步骤太多时，可以异步执行一些操作，这样浏览器就不会卡死，同步操作也不会延迟，可以解决复杂的操作问题。也可以用Promise来实现类似的功能。
4.移除浮动层并关闭它。
ele.addEventListener(‘click ‘，function() {
设置超时(
函数(){
$ ele . hide()；
}
, 500)
}，假)；
//这是延迟执行和DOM结合的一个例子。我们不想在事件执行后马上得到结果，而是延迟一段时间再执行。
4.DOM动画
var interval 2 = setInterval(function(){
if(ele . style . left & lt；屏幕宽度){
ele . style . left = ele . style . left+10+’ px ‘；
} else { clear interval(interval 2)；}
}, 20);
// JS动画离不开定时器和区间执行器。相比较而言，用于动画的间隔更好，但要记得在满足条件后清除间隔。
//这只是一个用法示例。真正的动画需要微调。
5.试题，结合范围，看你能不能答对并说出结果和顺序原因？
测试1:
函数回调(a){
返回函数(){
alert(” Hello “+a)；
}
}
设a = “世界”；
setTimeout(回调(a)，1000)；
A = “你好”；
测试2:
函数回调(a){
返回函数(){
alert(” Hello “+a)；
}
}
设a = “世界”；
setTimeout(function() {
回调(a)()；
}, 1000);
A = “你好”；
如果你能答对，那么setTimeout和setInterval的用法就都掌握了。
免责声明：本站所有文章内容,图片，视频等均是来源于用户投稿和互联网及文摘转载整编而成，不代表本站观点，不承担相关法律责任。其著作权各归其原作者或其出版社所有。如发现本站有涉嫌抄袭侵权/违法违规的内容,侵犯到您的权益，请在线联系站长,一经查实,本站将立刻删除。
