js定时器的设置和清除 setTimeOut()和setInterval()

最新推荐文章于 2025-03-17 18:06:31 发布

水火土要努力

最新推荐文章于 2025-03-17 18:06:31 发布

阅读量7w

点赞数

分类专栏： js 文章标签： javascript 超时调用和间歇调用

本文链接：https://blog.youkuaiyun.com/zhm0303/article/details/78952326

版权

js 专栏收录该内容

26 篇文章

订阅专栏

本文探讨了JavaScript中的超时调用setTimeout()和间歇调用setInterval()，解释了它们的区别及如何使用。setTimeout在指定时间后仅执行一次，而setInterval则会周期性调用，建议避免频繁使用。通过递归方式使用setTimeout可以实现类似setInterval的效果。同时，文章介绍了如何通过返回的定时器标识符来清除定时器，确保程序的可控性。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

 
 超时调用和间歇调用： 

  二者接受的参数相同，区别只在于: 

  setTimeOut(function(){},1000); 在特定时间之后调用函数， 
 只调用一次 

  setInterval(function(){},1000)；每隔特定的时间调用一次函数， 
 调用n多次,最好不要经常使用 

 
 tips: 

  递归的方式使用setTimeOut()，效果相当于使用setInterval() 

function showTime() {
  var date = new Date();
  var year = date.getFullYear();
  var month = date.getMonth();
  var day = date.getDate();
  var weekend = "星期" + "日一二三四五六".charAt(date.getDay());
  var hour = date.getHours();
  var minutes = date.getMinutes();
  var seconds = date.getSeconds();
  month = month < 10 ? "0" + month : month;
  day = day < 10 ? "0" + day : day;
  hour = hour < 10 ? "0" + hour : hour;
  minutes = minutes < 10 ? "0" + minutes : minutes;
  seconds = seconds < 10 ? "0" + seconds : seconds;
  var str = year + "年" + month + "月" + day + "日" + "  " + weekend + "  " + hour + ":" + minutes + ":" + seconds;
  var nowDate = document.getElementById("date");
  nowDate.innerHTML = str;
  var param=setTimeout(showTime, 1000);
  //setTimeOut()方法会返回一个数值ID，便于清除定时器时使用
  console.log(param);

//
  clearTimeout(param);

}
showTime();

  setTimeOut()和setInterval()都会返回定时器对象的标识符 

  运行结果如下： 返回的标识符可以用于清除定时器 

  clearTimeOut(10)，clearInterval(10) 

  此处的意思是，函数执行10次之后，清除定时器 