using setTimeout in for loop(在for循环中使用setTimeout)
本文介绍了在for循环中使用setTimeout的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我正在尝试编写打印5等待1秒、打印4等待2秒、打印3等待3秒的函数
我写了这个函数:
for(let i=5;i>0;i--){
setTimeout(()=>{
let localTime = new Date().toLocaleString();
console.log(`${i} - ${localTime}`)
},5-i*1000);
}
打印:
'5 - 10/30/2019, 11:10:17 AM'
'4 - 10/30/2019, 11:10:17 AM'
'3 - 10/30/2019, 11:10:17 AM'
'2 - 10/30/2019, 11:10:17 AM'
'1 - 10/30/2019, 11:10:17 AM'
我写了一组语句:
console.log(new Date().toLocaleString());
setTimeout(()=>{
let localTime = new Date().toLocaleString();
console.log(`${5} - ${localTime}`)
},1000)
setTimeout(()=>{
let localTime = new Date().toLocaleString();
console.log(`${4} - ${localTime}`)
},2*1000)
setTimeout(()=>{
let localTime = new Date().toLocaleString();
console.log(`${3} - ${localTime}`)
},3*1000)
setTimeout(()=>{
let localTime = new Date().toLocaleString();
console.log(`${2} - ${localTime}`)
},4*1000)
setTimeout(()=>{
let localTime = new Date().toLocaleString();
console.log(`${1} - ${localTime}`)
},5*1000)
和这些打印:
'10/30/2019, 11:13:45 AM'
'5 - 10/30/2019, 11:13:46 AM'
'4 - 10/30/2019, 11:13:47 AM'
'3 - 10/30/2019, 11:13:48 AM'
'2 - 10/30/2019, 11:13:49 AM'
'1 - 10/30/2019, 11:13:50 AM'
第二组语句将时间增加了1秒,但For循环中设置的超时未执行。
如何实现该功能?我哪里出错了?
推荐答案
操作顺序
5 - 1 * 1000
5 - (1*1000)
5 - 1000
-995
它需要有括号
},(5-i) * 1000);
不使用for循环的更好方法是创建一个函数,并让计时器递归地调用它,直到它完成。
数据-lang="js"数据-隐藏="假"数据-控制台="真"数据-巴贝尔="假">function countDown (max) {
function execute () {
let localTime = new Date().toLocaleString();
console.log(`${max} - ${localTime}`)
max -= 1
if (max>0) window.setTimeout(execute, 1000)
}
execute()
}
countDown(5);
这篇关于在for循环中使用setTimeout的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持编程学习网!
沃梦达教程
本文标题为:在for循环中使用setTimeout


猜你喜欢
- Fetch API 如何获取响应体? 2022-01-01
- 如何使用 JSON 格式的 jQuery AJAX 从 .cfm 页面输出查 2022-01-01
- Css:将嵌套元素定位在父元素边界之外一点 2022-09-07
- 使用RSelum从网站(报纸档案)中抓取多个网页 2022-09-06
- Flexslider 箭头未正确显示 2022-01-01
- 400或500级别的HTTP响应 2022-01-01
- 失败的 Canvas 360 jquery 插件 2022-01-01
- Quasar 2+Apollo:错误:找不到ID为默认的Apollo客户端。如果您在组件设置之外,请使用ProvideApolloClient() 2022-01-01
- CSS媒体查询(最大高度)不起作用,但为什么? 2022-01-01
- addEventListener 在 IE 11 中不起作用 2022-01-01