setTimeout只执行一次,setInterval周期性重复执行;前者适用于延时操作如防抖,后者用于轮询或倒计时,但需clearInterval手动清除以防内存泄漏。

JavaScript 中的 setTimeout 和 setInterval 都是用来延迟或周期性执行代码的计时器函数,核心区别在于:一个只执行一次,另一个会反复执行。
setTimeout:延迟执行一次
它在指定毫秒数后,执行一次回调函数。适合做“等一会儿再干某事”,比如页面加载后延时提示、防抖操作、模拟异步响应等。
- 语法:
setTimeout(回调函数, 延迟毫秒数, ...参数) - 返回一个唯一的定时器 ID(数字),可用于后续取消:
clearTimeout(id) - 注意:延迟时间是“至少等待”,不是精确保证;如果主线程正忙(如大量计算或长任务),实际执行会被推迟
setInterval:按固定间隔重复执行
它每隔指定毫秒数就执行一次回调,直到被手动清除。常用于轮询、动画帧模拟、倒计时刷新等场景。
- 语法:
setInterval(回调函数, 间隔毫秒数, ...参数) - 同样返回定时器 ID,用
clearInterval(id)停止 - ⚠️ 容易出错:忘记清除会导致内存泄漏或逻辑混乱;若回调执行时间超过设定间隔,下一次调用会“排队”(不跳过),可能造成堆积
关键差异对比
- 执行次数:setTimeout 执行 1 次;setInterval 默认无限次(需手动停)
- 适用节奏:setTimeout 是“单点触发”;setInterval 是“周期节奏”
- 可控性:setTimeout 更安全,不易失控;setInterval 必须配对 clearInterval,否则持续运行
- 替代方案:需要精准间隔(避免堆积)时,可用 setTimeout 递归调用代替 setInterval
实用小技巧
- 用箭头函数或绑定 this 避免回调中 this 丢失:
setTimeout(() => obj.do(), 100) - 传参推荐用闭包或展开运算符,避免字符串形式(已废弃):
setTimeout(fn, 100, arg1, arg2) - 倒计时示例中,优先用 setTimeout 递归,更可控:let timer = setTimeout(() => { count--; if (count > 0) timer = setTimeout(...); }, 1000);











