window对象有两个主要的定时方法,分别是setTimeout和setInteval。他们的语法基本上相同,它们都有两个参数,一个是将要执行的代码字符串,一个是以毫秒为单位的时间间隔。都可以用来实现在一个固定时间段之后去执行那段代码。不过这两个函数还是有很大区别的。
setTimeout方法是定时程序,也就是在指定时间以后干什么,干完了就拉倒,只执行一次:它从载入后延迟指定的时间去执行一个表达式或者是函数,仅执行一次,清除时使用clearTimeout。
setInterval方法则是表示间隔一定时间反复执行某操作:它从载入页面后每隔指定的时间去反复执行一个表达式或者是函数(功能类似于递归函数),清除时使用clearInterval。
虽然表面上看来setTimeout只能应用在on-off方式的动作上,不过可以通过创建一个函数循环重复调用setTimeout,以实现重复的操作。即用setTimeout实现setInerval的功能,就需要在执行的程序中再定时调用自己才行。如下:
showTime();
function showTime(){
timeDom.innerHTML= '今天是 ' + new Date().toLocaleString() +' 星期'+'日一二三四五六'.charAt(new Date().getDay());
setTimeout("showTime()", 5000);
}
一旦调用了这个函数,那么就会每隔5秒钟就显示一次时间。如果使用setInterval,则相应的代码如下所示:
setInterval("showTime()", 5000); //或setInterval(showTime, 5000);或匿名函数实现也是可以的
function showTime(){
timeDom.innerHTML= '今天是 ' + new Date().toLocaleString() +' 星期'+'日一二三四五六'.charAt(new Date().getDay());
}
这两种方法可能看起来非常像,而且显示的结果也会很相似,不过两者的最大区别就是,setTimeout方法不会每隔5秒钟就执行一次showTime函数,它是在每次调用setTimeout后过5秒钟再去执行showTime函数。这意味着如果showTime函数的主体部分需要2秒钟执行完,那么整个函数则要每7秒钟才执行一次。而setInterval却没有被自己所调用的函数所束缚,它只是简单地每隔一定时间就重复执行一次那个函数。
如果要求在每隔一个固定的时间间隔后就精确地执行某动作,那么最好使用setInterval,而如果不想由于连续调用产生互相干扰的问题,尤其是每次函数的调用需要繁重的计算以及很长的处理时间,那么最好使用setTimeout。
函数指针的使用:
两个计时函数中的第一个参数是一段代码的字符串,其实该参数也可以是一个函数指针。如果用函数指针作为setTimeout和setInterval函数的第一个参数,那么它们就可以去执行一个在别处定义的函数了:
setTimeout(showTime, 500);
function showTime(){
timeDom.innerHTML= '今天是 ' + new Date().toLocaleString() +' 星期'+'日一二三四五六'.charAt(new Date().getDay());
}
另外,匿名函数还可以声明为内联函数:
setTimeout(function(){
timeDom.innerHTML= '今天是 ' + new Date().toLocaleString() +' 星期'+'日一二三四五六'.charAt(new Date().getDay());
}, 500);
清除定时器:
如果对计时函数不加以处理,那么setInterval将会持续执行相同的代码,一直到浏览器窗口关闭,或者用户转到了另外一个页面为止。不过还是有办法可以终止setTimeout和setInterval函数的执行。
当setInterval调用执行完毕时,它将返回一个timerID,将来便可以利用该值对计时器进行访问,如果将该ID传递给clearInterval,便可以终止那段被调用的过程代码的执行了。
例如:tttt=setTimeout('showTime()',1000);
clearTimeout(tttt);
或者:
tttt=setInterval('showTime()',1000);
clearInteval(tttt);
参考
http://www.cnblogs.com/qiantuwuliang/archive/2009/06/20/1507304.html
分享到:
相关推荐
总之,`setTimeout()`和`setInterval()`是JavaScript中用于处理时间调度的核心工具,它们的正确使用对于编写健壮的前端应用至关重要。理解它们的工作机制,并根据需求选择合适的函数,能够帮助开发者更好地控制代码...
在JavaScript中,`setTimeout` 和 `setInterval` 是两种非常重要的定时器函数,它们用于在指定的时间后执行特定的函数或代码块。这篇文章将深入探讨这两个函数的使用方法、相同之处以及它们之间的区别。 首先,`...
使用SetInterval和设定延时函数setTimeout 很类似。setTimeout 运用在延迟一段时间,再进行某项操作。
JavaScript定时器是编程中不...总之,理解并正确使用`setTimeout`和`setInterval`是JavaScript开发中的基础技能。它们可以帮助我们实现延迟执行、定时执行和周期性执行等功能,但同时也需要谨慎处理以防止潜在的问题。
在JavaScript中,setTimeout和setInterval是两个基本的定时器函数,用于实现延迟执行或循环执行某个函数。然而,这两个函数在执行时往往和我们设置的延迟时间有出入。本文将深入探讨JS定时器的执行机制,分析why ...
在JavaScript中,定时执行任务是通过`setTimeout`和`setInterval`这两个函数来实现的。它们都是用于在指定延迟后执行代码,但它们之间存在显著的区别。 `setTimeout`函数用于在给定的`DelayTime`(延迟时间)过后...
通过以上的分析可以看出,尽管`setTimeout`与`setInterval`都可以用来控制代码的执行时间,但它们的应用场景和执行方式存在本质的区别。正确理解和运用这两个函数对于提高JavaScript程序的性能和用户体验至关重要。
今天先学下setTimeout和setInterval的使用。 一、setTimeout超时计时器(和GCD中的after类似) 在node.js中可以使用node.js内置的setTimeout(callback,delayMillSeconds,[args])方法。当调用setTime()时回调函数会在...
Javascript的setTimeOut和setInterval函数应用非常广泛,它们都用来处理延时和定时任务,比如打开网页一段时间后弹出一个登录框,页面每隔一段时间发送异步请求获取最新数据等等。但它们的应用是有区别的。 ...
### 给C#添加SetTimeout和SetInterval函数 在日常的软件开发过程中,我们经常会遇到需要定时执行某些任务的情况。JavaScript 提供了 `setTimeout` 和 `setInterval` 这两个非常方便的函数来处理这样的需求。然而,...
在使用 setTimeout 和 setInterval 函数时,需要注意参数的传递方式和调用方式。使用闭包可以正确地传递参数,避免出现意外的结果。同时,需要注意函数的调用方式,例如 `setTimeout(auto, 4000)` 和 `setInterval...
通过这些知识点,可以看出setTimeout和setInterval在功能上非常相似,但各自的特点决定了它们在不同的场景下使用。例如,如果只需要延迟执行一次操作,推荐使用setTimeout;如果需要周期性执行操作,可以使用...
在使用setTimeout和setInterval时,你可以通过返回值(一个定时器ID)来控制它们。这个ID可以用于后续的clearTimeout和clearInterval函数来取消定时器。 #### 删除setTimeout 当你想取消由setTimeout设置的定时器时...
在Vue.js应用中,我们经常会遇到使用`setTimeout`和`setInterval`来实现某些延时或周期性操作。然而,如果不正确地管理这些定时器,它们可能会在组件被销毁后仍然继续运行,导致不必要的资源消耗和潜在的问题。本文...
### setTimeout和setInterval的浏览器兼容性分析 #### 一、概述 `setTimeout` 和 `setInterval` 是JavaScript中用于处理延时与周期性任务的重要函数。它们被广泛应用于各种前端开发场景,例如页面动画效果、轮询...
在JavaScript编程中,定时器是控制...通过本文的介绍,你应该对setTimeout和setInterval有了更深入的理解,以及如何在实际项目中有效地使用它们。记住,掌握这些基础知识是成为一名优秀的JavaScript开发者的重要一步。
总之,理解JavaScript的`this`指向以及Vue中`setTimeout`和`setInterval`的正确使用方式,以及熟悉Element UI等UI库的API规范,是避免这类问题的关键。通过使用箭头函数来保持`this`的正确指向,以及按照UI库的推荐...
JavaScript中的`setTimeout`和`setInterval`是两个重要的定时器函数,它们都属于全局`window`对象的方法,常用于在指定的时间后执行某段代码或周期性地重复执行某段代码。然而,它们的工作机制和用途有所不同。 1. ...
大概半年前发表过一篇关于setTimeout和setInterval的文章,但是现在回去仔细一看发现其实存在很多不足以及错误。事实上,setTimeout和setInterval并没有我们字面上理解的那么简单。要真正掌握并理解这两个方法,还得...