浅谈JavaScript超时调用和间歇调用

  • Z时代
  • 2024-01-10
  • 分类：综合

间歇调用

在JavaScript中间歇调用很常见，setInterval，就是间隔一定的时间重复调用。

setInterval()方法接收两个参数：第一个参数可以是字符串，也可以是函数，第二个参数是一个以毫秒为单位的数字，表示重复间隔的时长。

参数是字符串

当第一个传递参数是字符串时，如下：

setInterval("alert('this is a string.')",1000);

这里的字符串是一段JavaScript代码，和传入的eval()函数的参数一样，如果是有内外两个引号的话，记得引号不要相同就行了。

setInterval()会返回一个数值型的ID，这个ID是计划执行代码的唯一标识符，所以可以用它来取消重复操作。setInterval()对应的一个取消该操作的方法：clearInterval()，当然要取消重复操作的话，clearInterval()必须放在还没有执行完毕的时候。

比如：

var intervalId=setInterval(...);
clearInterval(intervalId);

首先我们获取ID，然后将ID传入clearInterval()中即可，因为取消操作紧跟在setInterval()后面，所以可以立即取消，就和没发生一样。

参数是函数

因为当传递的参数是字符串的时候，可能会导致性能损失，所以一般情况下，用的最多的还是给它传递一个函数。

如下：

var num=0;
function increNum(){
 num++;
 if(num>=10){
  clearInterval(intervalId);
  alert('over');
 }
}
intervalId=setInterval(increNum,500);

该段程序设置了一个increNum函数，并作为参数传递给setInterval()，同时当重复运行到10次的时候，取消运行操作，弹出警告框。

超时调用

超时调用和间歇调用类似，setTimeout()，它也接收两个参数，第一个可以是包含JavaScript代码的字符串，也可是一个函数，第二个参数是延时时间和setInterval()方法的参数是一样。

但是这里要说明一点：

延时时间并不是说经过设定的延时后程序一定会执行。

为什么呢？

因为JavaScript是单线程解释器，所以在一定的时间内只能执行一段代码，不能同时执行多段代码，所以在JavaScript中有一个任务队列，将要执行的任务按照先后顺序排在队列中，设定的延时时间是经过这段时间将当前任务加入到任务队列中。如果当前没有任务执行，那么加入到任务队列中的代码立刻执行，如果当前还有正在执行的代码段，那么只有当该代码段执行完毕后再执行新加入的任务。

同样，setTimeout()也有一个返回ID，也可以通过这个数值ID来取消超时调用，对应的取消方法是clearTimeout()。

在这里，我们用超时调用方法来把间歇调用中的那段重复执行的代码复写一遍：

var num=0;
function increNum(){
 num++;
 if(num<=10){
  setTimeout(increNum,500);
 }else{
  alert('over');
 }
}
setTimeout(increNum,500);

这段程序也可以完成重复操作并在10次之后终止操作，和上述的setInterval()有区别的是它并没有用返回的数值ID。

因为setInterval()是重复执行，所以一直会有数值ID返回，所以必须得一直跟踪这个数值ID，而setTimeout()执行完毕后就不再执行，所以我们不用跟踪这个返回的数值ID，这就给我们带来了一定的便利。

而且，后一个间歇调用可能会在前一个间歇调用还没结束之前被调用，当函数的执行时间比间歇调用的时间长的时候这种情况就会发生，所以综上所述，用setTimeout()来模拟间歇调用是一种比较好的途径。

当然，在比较简单的程序中用setInterval()还是没有很大问题的（突然想起了一句话，存在即是合理的~~~~）。

以上是 浅谈JavaScript超时调用和间歇调用 的全部内容， 来源链接： utcz.com/z/315096.html

回到顶部