setTimeout用于延迟执行一次代码,setInterval用于每隔固定时间重复执行;二者均返回定时器ID以便clearTimeout/clearInterval清除;最小延迟约4ms,页面失焦时setInterval会降频。

setTimeout 用于延迟执行一次代码,setInterval 用于每隔固定时间重复执行一段代码。两者都返回一个数字 ID,可用于后续清除定时器。
setTimeout:只执行一次的延时任务
适合做“等一会儿再做某事”,比如页面加载后延迟显示提示、防抖操作、异步流程控制等。
- 基本写法:
setTimeout(函数, 毫秒数),例如setTimeout(() => console.log('3秒后执行'), 3000) - 函数可以是匿名函数,也可以是已定义的函数名(不带括号)
- 如果需要传参,推荐用箭头函数包裹,避免参数被立即执行:
setTimeout(() => myFunc(arg1, arg2), 1000) - 返回值是定时器 ID,可用
clearTimeout(id)主动取消未触发的任务
setInterval:周期性重复执行
适合轮询、倒计时、动画帧模拟、心跳检测等需要反复运行的场景。
在 Java 中初始化和管理阿里云 SDK客户端。包括单例模式、线程安全、endpoint 与 region 配置、VPC 终端节点、同步与异步等。
- 基本写法:
setInterval(函数, 毫秒数),例如setInterval(() => console.log('每2秒执行一次'), 2000) - 和 setTimeout 一样,函数参数建议用箭头函数传递,避免 this 或参数问题
- 必须配合
clearInterval(id)使用,否则会一直运行,造成内存泄漏或性能问题 - 注意:如果回调执行时间超过间隔时间,不会累积执行,而是等上一次结束后再开始下一轮(除非用递归 setTimeout 模拟精确节拍)
常见陷阱与注意事项
这两个 API 看似简单,但容易出错的地方不少:
立即学习“Java免费学习笔记(深入)”;
- 最小延迟限制:HTML 规范规定 setTimeout/setInterval 最小延迟为 4ms(部分浏览器可能更低),即使设成 0,实际也至少等待 4ms
- 页面失焦时降频:浏览器在标签页不可见时会将 setInterval 延迟拉长(通常到 1s 左右),setTimeout 不受影响
-
闭包中的变量陷阱:循环中创建定时器时,若直接使用循环变量(如
for (let i=0; i),需注意 var 和 let 的作用域差异;用 let 更安全 -
不要依赖 setInterval 做精确计时:它不是实时系统,受 JS 单线程、GC、CPU 负载影响,误差明显;高精度需求建议用
requestAnimationFrame或记录时间戳手动计算
替代方案:用 setTimeout 模拟 setInterval(更可控)
当需要确保每次执行完才启动下一次、或想灵活控制节奏时,推荐递归调用 setTimeout:
- 写法示例:
function repeat() { console.log('执行'); setTimeout(repeat, 1000); } repeat(); - 好处:不会因回调阻塞导致堆叠;可随时 break、修改间隔、加入条件判断
- 缺点:代码稍多,需手动管理启动/停止逻辑(比如加个 flag 控制是否继续)

















