资讯专栏INFORMATION COLUMN

javascript中,如何用setTimeout函数模拟实现setInterval函数?

邱勇 / 1824人阅读

摘要:定义对象,用于保存映射到真实每调用一次就会自增的一个这里注意要使用局部变量保存哦,避免函数内部直接引用,因为可能会再次变化说明使用时除了需要加上一个对象做命名空间外其实也是没办法哦,因为和需要共享一个叫做的映射表,其他与直接调用原生,无异举

talk is cheap:

var util = (function(){
    //定义intervalObj对象,用于保存intervalId映射到真实timeoutId
    var intervalObj = {}
    //每调用一次_setInterval就会自增1的一个intervalId
    var intervalId = 0

    var _setInterval = function(fn, interval){
        //这里注意要使用局部变量保存intervalId哦,避免next函数内部直接引用intervalId,因为intervalId可能会再次变化
        var thisIntervalId = ++intervalId
        function next(){
            intervalObj[thisIntervalId] = setTimeout(function(){
                fn()
                next()
            }, interval)
        }
        next()
        return thisIntervalId
    }

    var _clearInterval = function(intervalId){
        clearTimeout(intervalObj[intervalId])
    }

    return {setInterval: _setInterval, clearInterval: _clearInterval}

})()

说明:使用时除了需要加上一个util对象做命名空间外(其实也是没办法哦,因为util.setInterval和util.clearInterval需要共享一个叫做intervalObj的映射表),其他与直接调用原生setInterval,clearInterval无异

举个栗子?:

//开始一个定时执行函数
var intervalId = util.setInterval(function(){
    console.log("a")
}, 1000)

//10秒之后,清除掉定时器
setTimeout(function(){
    //实际清除代码
    util.clearInterval(intervalId)
}, 10000)

各路大神如果其他解决方案,请一定要留言赐教,并收下我的膝盖

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/85196.html

相关文章

  • 浏览器渲染机制

    摘要:浏览器渲染进程浏览器内核进程,内部是多线程的默认每个页面一个进程,互不影响。事件触发线程归属于浏览器而不是引擎,用来控制事件循环可以理解成引擎自己都忙不过来,需要浏览器另开线程协助。 线程和进程 进程和线程的概念可以这样理解: 进程是一个工厂,工厂有它的独立资源--工厂之间相互独立--线程是工厂中的工人,多个工人协作完成任务--工厂内有一个或多个工人--工人之间共享空间 工厂有多个工人...

    appetizerio 评论0 收藏0
  • 浏览器渲染机制

    摘要:浏览器渲染进程浏览器内核进程,内部是多线程的默认每个页面一个进程,互不影响。事件触发线程归属于浏览器而不是引擎,用来控制事件循环可以理解成引擎自己都忙不过来,需要浏览器另开线程协助。 线程和进程 进程和线程的概念可以这样理解: 进程是一个工厂,工厂有它的独立资源--工厂之间相互独立--线程是工厂中的工人,多个工人协作完成任务--工厂内有一个或多个工人--工人之间共享空间 工厂有多个工人...

    lncwwn 评论0 收藏0
  • 浅析JavaScript异步

    摘要:回调函数,一般在同步情境下是最后执行的,而在异步情境下有可能不执行,因为事件没有被触发或者条件不满足。同步方式请求异步同步请求当请求开始发送时,浏览器事件线程通知主线程,让线程发送数据请求,主线程收到 一直以来都知道JavaScript是一门单线程语言,在笔试过程中不断的遇到一些输出结果的问题,考量的是对异步编程掌握情况。一般被问到异步的时候脑子里第一反应就是Ajax,setTimse...

    Tangpj 评论0 收藏0
  • js 执行机制 事件循环

    摘要:事件完成,回调函数进入。我们来分析一段较复杂的代码,看看你是否真的掌握了的执行机制第一轮事件循环流程分析如下整体作为第一个宏任务进入主线程,遇到,输出。宏任务微任务第三轮事件循环宏任务执行结束,执行两个微任务和。 关于JavaScript 首先js是单线程的,执行任务肯定是一个接着一个。在最新的html5中提出了web-worker,但是JavaScript是单线程这一核心没有改变,一...

    JackJiang 评论0 收藏0
  • Javascript定时器那些事儿

    摘要:一什么是定时器提供了一些原生方法来实现延时去执行某一段代码,下面来简单介绍一下设置一个定时器,在定时器到期后执行一次函数或代码段定时器延迟后执行的函数延迟后执行的代码字符串,不推荐使用原理类似延迟的时间单位毫秒,默认值为向延迟函数传递而外的 一、什么是定时器 JS提供了一些原生方法来实现延时去执行某一段代码,下面来简单介绍一下 setTimeout: 设置一个定时器,在定时器到期后执行...

    Riddler 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<