首页投稿(暂停使用,暂停投稿)

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

2016-09-04  本文已影响473人  恐怕是小珠桃子

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

实现一个打点计时器,要求
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修饰的直接定义的变量本身就是全局变量,但是,总觉得这样不够严谨~

上一篇 下一篇

猜你喜欢

热点阅读