宝哥软件园

理解javascript定时器中的setTimeout和setInterval

编辑:宝哥软件园 来源:互联网 时间:2021-09-17

一、解释。

1.概述。

SetTimeout:在指定的延迟时间后调用函数或执行代码片段。

SetInterval:定期调用一个函数或执行一段代码。

2.语法

设置超时:

var timeoutID=window . settimeout(func,delay,[param1,param2,]);var timeoutID=window.setTimeout(代码,延迟);TimeoutID是延迟操作的数字标识,然后可以用作window.clearTimeout方法的参数。func是您希望在延迟毫秒后执行的函数代码。在第二种语法中,它意味着您想要在延迟毫秒后执行的代码是延迟毫秒(一秒等于1000毫秒)。函数调用将在延迟后发生。然而,实际延迟时间可能稍长。标准浏览器和IE10支持函数setInterval,即在第一种语法中将额外的参数传递给延迟函数。

var intervalID=window . set interval(func,delay[,param1,param2,]);var intervalID=window . set interval(代码,延迟);Interval是这个重复操作的唯一标识符,可以作为参数传递给clearInterval()。Func是一个你想反复调用的函数。代码是另一种语法的应用,这意味着由你想重复执行的字符串组成的代码是每次延迟的毫秒数(一秒等于1000毫秒),函数的每次调用都会在这个延迟之后发生。与setTimeout一样,实际延迟时间可能稍长。标准浏览器和IE10支持在第一种语法中传递额外参数来延迟函数的功能。脚本类型=' text/JavaScript ' settimeout(function(param){ alert(param)},100,' ok ');/脚本

我只是测试了第五项,分别在我的电脑上使用了firefox和IE9。前者可以顺利弹出ok,后者弹出undefined。

第二,“这个”问题。

setTimeout()调用的代码运行在与它所在的函数完全分离的执行环境中。这将导致这些代码中包含的this关键字指向window(全局对象)对象,该对象不同于this的预期值。SetInterval类似。

脚本类型=' text/JavaScript '//这指向窗口函数形状(名称){this。name=namethis.timer=function(){alert('我的形状是' this . name)};setTimeout(this.timer,50);}新形状('矩形');/脚本

没有传输,用chrome、firefox、IE9做实验,都是结果。

解决方案1:

脚本类型='text/javascript '函数形状(名称){ this.name=namethis.timer=function(){alert('我的形状是' this . name)};var _ this=thissetTimeout(function(){ _ this . timer . call(_ this)},50);}新形状('矩形');/script设置一个局部变量this,然后放入setTimeout的函数变量中,定时器执行call或apply来设置this的值。

由于Javascript的关闭,函数可以调用局部变量this。它涉及范围链等知识。感兴趣的人可以自己了解一下。这里就不推出了。

解决方案2:

这个方法有点高。SetTimeout和setInterval是自定义的。此外,它扩展了IE浏览器的较低版本,不支持向延迟函数传递额外参数的问题。

脚本类型='text/javascript' //自定义setTimeout与setInterval var _ _ native est _ _=window。settimeout,_ _ native si _ _ _=window。setIntervalwindow.setTimeout=函数(vCallback、nDelay /*、argumentToPass1、argumentToPass2等)。*/) { var oThis=this,aArgs=array。原型。切片。call(参数,2);返回_ _原生est _ _(vcall回函数实例?function(){ vcallback。应用(Othis,AARgs);} : vCallback,nDelay);};窗户。setinterval=function(vcall back、nDelay /*、argumentToPass1、argumentToPass2等)。*/) { var oThis=this,aArgs=array。原型。切片。call(参数,2);返回_ _ nativeSI _ _(vcall函数的后实例?function(){ vcallback。应用(Othis,AARgs);} : vCallback,nDelay);};函数形状(名称){ this.name=namethis。timer=函数(其他){ alert('我的形状是这个。姓名);警报('额外参数是其他’);};} var矩形=新形状('矩形');setTimeout.call(矩形,矩形。计时器,50,‘其他’);/script1,设置局部变量,赋值为原生的setTimeout与setInterval

2、扩展setTimeout与设置间隔通过分割争论这个变量,获取到额外的参数数组

3、用函数的vCallback实例判断这是不是一个函数或代码,如果是函数就用应用执行

4、设置超时用呼叫执行,设定这对象,以及其它的功能、延迟等参数

5、顺便扩展设定时间低版本的浏览器也能执行额外参数

三、设置超时与setInterval之间的一个区别

脚本类型=' text/JavaScript ' setTimeout(function(){/*一些长代码块.*/setTimeout(参数。calleeper,100);}, 10);setInterval(函数(){ /*一些长代码块.*/}, 100);/script看上去,两个功能是差不多的,但是里面其实是不一样的。

setTimeout回调函数的执行和上一次执行之间的间隔至少有100毫秒(可能会更多,但不会少于100毫秒)

setInterval的回调函数将尝试每隔100毫秒执行一次,不论上次是否执行完毕,时间间隔理论上是会延迟的。

设置间隔:

脚本类型='text/javascript '函数休眠(毫秒){ var start=new Date();while(new Date()-start=ms){ } } var end time=null;var I=0;setInterval(计数,100);函数计数(){ var elapsedTime=endTime?(新日期()-结束时间): 100;我;console.log('当前计数: ' i ')运行时间:“elapsedTime‘ms’);睡眠(200);结束时间=新日期();}/脚本从火狐浏览器的萤火虫可以查看到,时间间隔很不规则。

情况大致是这样的:由于数数函数的执行时间远大于setInterval的定时间隔,那么定时触发线程就会源源不断的产生异步定时事件,并放到任务队列尾而不管它们是否已被处理,但一旦一个定时事件任务处理完,这些排列中的剩余定时事件就依次不间断的被执行。

设置超时:

脚本类型='text/javascript '函数休眠(毫秒){ var start=new Date();while(new Date()-start=ms){ } } var end time=null;var I=0;setTimeout(计数,100);函数计数(){ var elapsedTime=endTime?(新日期()-结束时间): 100;我;console.log('当前计数: ' i ')运行时间:“elapsedTime‘ms’);睡眠(200);结束时间=新日期();setTimeout(计数,100);}/脚本

以上就是本文的全部内容,希望对大家学习爪哇岛描述语言定时器有所帮助。

更多资讯
游戏推荐
更多+