关于JS中设置定时器使用setTimeout还是setInterval

今天,在牛客上练习编程,看到这样一个题目:

实现一个打点计时器,要求
1、从 start 到 end(包含 start 和 end),每隔 100 毫秒 console.log 一个数字,每次数字增幅为 1
2、返回的对象中需要包含一个 cancel 方法,用于停止定时操作
3、第一个数需要立即输出

一开始想到要用setInterval,因为setInterval是每隔一段时间执行一次,而setTimeout是指定的时间段后执行代码;具体用法点击这里

现在回到问题本身,使用setInterval的话,当然要设置对start进行++操作,第一个数要立即输出,所以要提前打印,在根据题目要求返回iu对象,代码如下:

function count(start,end){
    console.log(start++);
    var timer = setInterval(()=>{
    if(start <= end){
        console.log(start++);
    }
    },100)
    
    return {
        cancel: ()=>{clearInterval(timer)}
    }
}

有人问第一次打印的为什么是start++,难道不应该是start吗?
因为console.log(start++);是先打印start,再将其自增的,所以如果第一次打印的是start,那么进入setIntervalstart将是未自增的值,所以,会使第一个数字重复打印,对吧~

当然,这道题也可以用setTImeout来解决,只要重复调用count函数就好了,具体实现如下:

var timer;
function count(start,end) {
    if(start <= end) {
        console.log(start++);
        timer = setTimeout(()=>{
            count(start,end);
        },100)
    }
    
    return {
        cancel:()=>{clearTimeout(timer)}
    }
}

这里的timer是一个全局变量,当然,也可以不用在外部声明,因为不用var修饰的直接定义的变量本身就是全局变量,但是,总觉得这样不够严谨~

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

  • 工厂模式类似于现实生活中的工厂可以产生大量相似的商品,去做同样的事情,实现同样的效果;这时候需要使用工厂模式。简单...
    舟渔行舟阅读 8,105评论 2 17
  • Node.js 全局对象 JavaScript 中有一个特殊的对象,称为全局对象(Global Object),它...
    FTOLsXD阅读 446评论 0 2
  • 什么是闭包? 有什么作用闭包:函数对象可以通过作用域链相互关联,函数体内部的变量可以保存在函数的作用域内。 上述代...
    coolheadedY阅读 809评论 0 0
  • 问题 一、什么是闭包? 有什么作用? 闭包闭包就是能够读取其他函数内部变量的函数。在javascript中,只有函...
    婷楼沐熙阅读 653评论 0 0
  • 从JS执行机制说起 浏览器(或者说JS引擎)执行JS的机制是基于事件循环。 由于JS是单线程,所以同一时间只能执行...
    love2013阅读 953评论 0 1

友情链接更多精彩内容