JavaScript定时器通过setTimeout和setInterval实现,前者延迟执行一次,后者周期性重复执行,均返回ID供clearTimeout或clearInterval清除,常用于倒计时、轮播图等场景,需注意及时清理避免内存泄漏。

JavaScript定时器是控制代码在指定时间后或每隔一段时间重复执行的重要工具。主要通过 setTimeout 和 setInterval 两个函数实现,它们都属于浏览器的 Web API,不是 JavaScript 语言本身提供的功能。
setTimeout:延迟执行一次
setTimeout 用于在指定毫秒数后执行一段代码,只执行一次。
语法:
setTimeout(function, delay, param1, param2, …)
function:要执行的函数 delay:延迟时间(毫秒) param1, param2…:传递给函数的参数
示例1:延迟3秒后弹出提示
立即学习“Java免费学习笔记(深入)”;
setTimeout(() => { alert("3秒到了!");}, 3000);
示例2:传参使用
function sayHello(name) { console.log("你好," + name);}setTimeout(sayHello, 1000, "小明"); // 1秒后输出:你好,小明
setInterval:周期性重复执行
setInterval 每隔指定时间就执行一次函数,直到被清除。
语法:
setInterval(function, interval, param1, param2, …)
AppMall应用商店
AI应用商店,提供即时交付、按需付费的人工智能应用服务
56 查看详情
function:要重复执行的函数 interval:执行间隔(毫秒) 参数部分同 setTimeout
示例:每2秒打印一次时间
const timer = setInterval(() => { console.log(new Date().toLocaleTimeString());}, 2000);
清除定时器:clearTimeout 与 clearInterval
每次调用 setTimeout 或 setInterval 都会返回一个定时器ID,可用于取消定时任务。
clearTimeout(id):清除由 setTimeout 设置的定时器 clearInterval(id):清除由 setInterval 设置的定时器
示例:5秒后停止重复打印
const intervalId = setInterval(() => { console.log("正在运行...");}, 1000);// 5秒后清除setTimeout(() => { clearInterval(intervalId); console.log("定时器已停止");}, 5000);
常见应用场景:
页面倒计时(如抢购、验证码重发) 轮播图自动切换 实时更新时间显示 防抖/节流中的延时控制 模拟异步加载效果
注意事项:
延迟时间最小为0,但实际执行可能受浏览器最小延迟限制(通常4ms左右) 定时器不保证精确时间,只能保证“至少等待这么久” 避免在循环中创建大量未清除的定时器,会造成内存泄漏 在组件销毁时(如Vue、React)记得清理定时器
基本上就这些。掌握 setTimeout 和 setInterval 的基本用法和清除机制,就能应对大多数需要时间控制的场景。关键是记得及时清理不需要的定时器,避免副作用。
以上就是JavaScript定时器怎样使用_JavaScriptsetTimeoutsetInterval用法与案例的详细内容,更多请关注创想鸟其它相关文章!
版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 chuangxiangniao@163.com 举报,一经查实,本站将立刻删除。
发布者:程序猿,转转请注明出处:https://www.chuangxiangniao.com/p/287706.html
微信扫一扫
支付宝扫一扫