定时器和延时器

Lán2022年11月4日
大约 1 分钟

定时器和延时器

定时器

setInterval()函数可以重复调用一个函数,在每次调用之间具有固定的时间间隔

setInterval(function() {
    //这个函数将自动被以固定间隔时间调用
},2000);

setInterval()函数可以接收第3、4.....个参数,它们将按顺序传入函数

setInterval(function(a,b) {
    //形参a的值为88,形参b的值为66
},2000,88,66);

具名函数也可以传入setInterval

var a = 0;
function fun(){
    console.log(++a);
}

setInterval(fun,1000);

清楚定时器

clearInterval()函数可以清除一个定时器

// 设置定时器,并且用timer变量接收这个定时器
var timer = setInterval(function() {

},2000);

// 点击按钮时,清楚定时器
oBtn.onclick = function() {
    clearInterval(timer);
}

延时器

setTimeout()函数可以设置一个延时器,当指定时间到了之后,会执行函数一次,不再重复执行

setTimeout(function() {
    //这个函数回在2秒后执行一次
},2000);

clearTimeout()函数可以清除延时器,和clearInterval()非常类似

异步

setInterval()和setTimeout()是两个异步语句

异步 (asynchronous) : 不会阻塞CPU继续执行其他语句当异步完成时,会执行“回调函数(callback)

函数节流

函数节流:一个函数执行一次后,只有大于设定的执行周期后才允许执行第二次

函数节流非常容易实现,只需要借助setTimeout()延时器

var lock = true;

function 需要节流的函数() {
    //如果锁时关闭状态,则不执行
    if(!lock) return;

    // 关锁
    lock = false;

    //指定毫秒数后将锁打开
    setTimeout(function() {
        lock = true;
    },2000);
}
上次编辑于: 2022/11/4 21:24:32
贡献者: lanjd