美文网首页
setTimeout实现setInterval

setTimeout实现setInterval

作者: 天神9527 | 来源:发表于2020-09-14 15:13 被阅读0次

    为什么要用setTimeout实现setInterval?

    setInterval定时器存在两个问题:
    (1)某个间隔的调用可能会被跳过;
    (2)定时器代码执行之间的间隔可能会比预期的小

    function SetInterval(handler, delay) {
        async function asyncFunc() {
            await handler();
            this.timerId = setTimeout(asyncFunc, delay);
        }
        this.end = function() {
            this.timerId && clearTimeout(this.timerId) && (this.timerId = null);
        }
        this.begin = function() {
            if (this.timerId == null) {
                asyncFunc = asyncFunc.bind(this);
                this.timerId = setTimeout(asyncFunc, delay);
            }
        }
    }
    
    var ins = new SetInterval(() => {
        return new Promise((resolve) => {
            //同步
            console.log('同步')
            resolve();
    
            //异步,大概这么写
            setTimeout(() => {
                console.log('异步');
                resolve();
            }, 2000);
        })
    }, 1000);
    
    ins.begin();
    
    setTimeout(() => {
        ins.end();
    }, 10000);
    

    如果定时器执行函数是异步调用,那么本例中控制台大约3s打印一次"异步",在定时器代码执行时,不会有其他定时器代码入队列,而是上一个定时器代码执行完成后,下一个定时器代码才会入队列等待执行

    相关文章

      网友评论

          本文标题:setTimeout实现setInterval

          本文链接:https://www.haomeiwen.com/subject/gtrzektx.html