setTimeout()与setInterval()定时器与区别

 代码如下 复制代码

setTimeout(function() {
    alert('你好!');
}, 0);
setInterval(callbackFunction, 100);

认为setTimeout中的问候方法会立即被执行,因为这并不是凭空而说,而是JavaScript API文档明确定义第二个参数意义为隔多少毫秒后,回调方法就会被执行. 这里设成0毫秒,理所当然就立即被执行了.
同理对setInterval的callbackFunction方法每间隔100毫秒就立即被执行深信不疑!

但随着JavaScript应用开发经验不断的增加和丰富,有一天你发现了一段怪异的代码而百思不得其解:

 代码如下 复制代码

div.onclick = function(){
        setTimeout(function() {
                document.getElementById('inputField').focus();
        }, 0);
};

既然是0毫秒后执行,那么还用setTimeout干什么, 此刻, 坚定的信念已开始动摇.

setTimeout()与setInterval()方法的区别

计时器setTimeout()与setInterval()是原生JS很重要且用处很多的两个方法, 但很多人一直误以为是相同的功能: 间隔时间重复执行传入的句柄函数. 但实际上, 并非如此, 既然JS给出了两个不同的命名, 肯定有其迥异之处.
先来看看两者JS手册及英文词典上的解释:
JS手册»setTimeout() : 用于在指定的毫秒数后调用函数或计算表达式;
英文释义»timeout() : 超时;暂时休息;工间休息;
JS手册»setInterval() : 按照指定的周期(以毫秒计)来调用函数或计算表达式. 会不停地调用函数,直到 clearInterval() 被调用或窗口被关闭;
英文释义»interval() : 间隔;间距;幕间休息;
不难看出, 只要我们仔细体会JS手册及命名释义, 就能很容易的区分开两者的区别. 简单的说, 两才的区别在于, setTimeout()方法是在等待指定时间后执行函数, 且只执行一次传入的句柄函数. setInterval()方法是每指定间隔时间后执行一次传入的句柄函数,循环执行直至关闭窗口或clearInterval().

 代码如下 复制代码

var timeout=function(){
 alert('等待2s后弹出,仅此一次!在等待时间内clearTimeout可停止执行!')
}
var interval=function(){
 alert('每2s循环弹出,直至clearInterval或关闭窗口!')
}
var input=document.getElementsByTagName('input');

var clearTimeoutFun=null;
var clearIntervalFun=null;

input[0].onclick=function(){
 clearTimeoutFun=setTimeout(timeout,2000);
}
input[1].onclick=function(){
 clearTimeout(clearTimeoutFun);
}
input[2].onclick=function(){
 clearIntervalFun=setInterval(interval,2000);
}
input[3].onclick=function(){
 clearInterval(clearIntervalFun);

时间: 2024-07-29 12:21:16

setTimeout()与setInterval()定时器与区别的相关文章

js setTimeout()与setInterval()方法的区别

先来看看两者js手册及英文词典上的解释: js手册»settimeout() : 用于在指定的毫秒数后调用函数或计算表达式; 英文释义»timeout() : 超时:暂时休息:工间休息; js手册»setinterval() : 按照指定的周期(以毫秒计)来调用函数或计算表达式. 会不停地调用函数,直到 clearinterval() 被调用或窗口被关闭; 英文释义»interval() : 间隔:间距:幕间休息; 不难看出, 只要我们仔细体会js手册及命名释义, 就能很容易的区分开两者的区别.

浅析js中setTimeout和setInterval详解

大概半年前发表过一篇关于setTimeout和setInterval的文章,但是现在回去仔细一看发现其实存在很多不足以及错误.事实上,setTimeout和setInterval并没有我们字面上理解的那么简单.要真正掌握并理解这两个方法,还得从javascript的单线程机制说起. JS手册»setTimeout() : 用于在指定的毫秒数后调用函数或计算表达式; 英文释义»timeout() : 超时:暂时休息:工间休息; JS手册»setInterval() : 按照指定的周期(以毫秒计)来

Javascript中setTimeOut和setInterval的定时器用法

 Javascript的setTimeOut和setInterval函数应用非常广泛,它们都用来处理延时和定时任务,比如打开网页一段时间后弹出一个登录框,页面每隔一段时间发送异步请求获取最新数据等等.但它们的应用是有区别的. setTimeout() 方法用于在指定的毫秒数后调用函数或计算表达式,而setInterval()则是在每隔指定的毫秒数循环调用函数或表达式,直到clearInterval把它清除.也就是说setTimeout()只执行一次,setInterval()可以执行多次.两个函

Javascript中setTimeOut和setInterval的定时器用法_javascript技巧

Javascript的setTimeOut和setInterval函数应用非常广泛,它们都用来处理延时和定时任务,比如打开网页一段时间后弹出一个登录框,页面每隔一段时间发送异步请求获取最新数据等等.但它们的应用是有区别的. setTimeout() 方法用于在指定的毫秒数后调用函数或计算表达式,而setInterval()则是在每隔指定的毫秒数循环调用函数或表达式,直到clearInterval把它清除.也就是说setTimeout()只执行一次,setInterval()可以执行多次.两个函数

setTimeout()与setInterval()方法区别介绍

 计时器setTimeout()和setInterval()两个都是js的计时功能的函数两个有些区别,下面为大家简单介绍下,希望对大家有所帮助 计时器setTimeout()和setInterval()两个都是js的计时功能的函数两个有些区别.    setTimeout():    在js手册中的解释:用于在指定的毫秒数后调用函数或计算表达式:    也就是说在执行完设定好的秒数后再执行.    实验代码(改变body背景颜色):   代码如下: setTimeout(function(){ 

setTimeout()与setInterval()方法区别介绍_javascript技巧

计时器setTimeout()和setInterval()两个都是js的计时功能的函数两个有些区别. setTimeout(): 在js手册中的解释:用于在指定的毫秒数后调用函数或计算表达式: 也就是说在执行完设定好的秒数后再执行. 实验代码(改变body背景颜色): 复制代码 代码如下: setTimeout(function(){ $("body").css("background","red"); },5000); setInterval(

js setTimeout 和 setInterval 的区别

 js setTimeout 和 setInterval 的区别,js setinterval   js settimeout   setinterval   window.setinterval   flash setinterval setinterval 参数   清除setinterval   asp setinterval   as setinterval   setinterval 停止 先看看例子看讲解一下.例如: tttt=setTimeout('northsnow()',100

setTimeout和setInterval的区别你真的了解吗?_javascript技巧

甚至可能会错误的把两个实现定时调用的函数理解成了类似thread一样的东西, 认为会在一个时间片内, 并发的执行调用的函数, 似乎很好很强大, 但其实并不是如此, 实际的情况是javascript都是以单线程的方式运行于浏览器的javascript引擎中的, setTimeout和setInterval的作用只是把你要执行的代码在你设定的一个时间点插入js引擎维护的一个代码队列中, 插入代码队列并不意味着你的代码就会立马执行的,理解这一点很重要. 而且setTimeout和setInterval

浅谈setTimeout 与 setInterval

  实际上,setTimeout和setInterval的语法相同.它们都有两个参数,一个是将要执行的代码字符串,还有一个是以毫秒为单位的时间间隔,当过了那个时间段之后就将执行那段代码.不过这两个函数还是有区别的 最新写代码中时,看到项目中有人用到了 setTimeout(fun,0),于是想总结一下.个人理解,如果有错误的地方还请指出.THX 要想理解JavaScript的定时器是如何工作的,先要明白 JavaScript 引擎是单线程的.这个可以理解为 javascript 引擎是一个服务员