javascript - 在 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 循环的更好方法是创建一个函数并让计时器递归调用它直到它完成。
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);
推荐阅读
- spring-boot - 如何在 Spring Boot 中使用 Spring Security 启用 CORS
- pandas - 查看客户是否在每个季度都有购买,然后绘制图表
- sql-server - EF Core“无法在具有唯一索引 [index] 的对象 'dbo.[table name]' 中插入重复的键行
- python - 如果文件不存在则创建一个文件,否则什么也不做
- java - 静态方法中的有界类型参数
- javascript - 节点断言测试
- angular - 制作简化的角材料手风琴,但未捕获输出事件
- python - Django如何为用户模型制作模型
- python - 如何正确设置特定模块以在 VS 代码中进行调试?
- java - Hibernate @ManyToMany 关系的唯一约束违反