「打点计时器」js实现一个打点计时器

打点计时器

问题描述：

1、从 start 到 end（包含 start 和 end），每隔 100 毫秒 console.log 一个数字，每次数字增幅 1
2、返回的对象中需要包含一个 cancel 方法，用于停止定时操作
3、第一个数需要立即输出

实现法一（settimeout()方法）：

function count(start, end) {
    if(start <= end){
        console.log(start++);
        st = setTimeout(function(){count(start, end)}, 100);
    }
    return {
        cancel: function(){clearTimeout(st);}
    }
}
count(1, 10);

实现法二（setInterval()方法）：

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

知识点：

setTimeout()方法用于在指定的毫秒数后调用函数或计算表达式。

语法：setTimeout(code, millisec)

注意：setTimeout() 只执行 code 一次。如果要多次调用，请使用 setInterval() 或者让 code 自身再次调用 setTimeout()。

setInterval() 方法可按照指定的周期（以毫秒计）来调用函数或计算表达式。

语法：setInterval(code ,millisec[,"lang"])

setInterval() 方法会不停地调用函数，直到 clearInterval() 被调用或窗口被关闭。由 setInterval() 返回的 ID 值可用作 clearInterval() 方法的参数。

注意：两个方法的第一个参数可以是字符串，也可以是函数

（1）如果是字符串，则参数是要执行的javascript代码串（加双引号），当作普通JavaScript语句执行即可。和eval()差不多，执行的环境是全局，所以不能访问函数作用域的变量。

（2）如果是函数（有括弧），则参数是该函数（不加双引号）的返回值，即真正执行的是其返回值，作用是【数值传递】。若返回值是另一个函数对象X，则执行的是函数X里的内容；若函数没定义返回值时值为un defined，或返回值为非函数对象，则无任何执行操作。

（3）如果是函数名（无括弧），则参数是该函数对象（不加双引号）本身，即真正执行的就是函数中的语句，且与返回值无关，作用是【函数调用】。通过”function() { xxx(argv); }”还能访问该函数作用域链上的变量。

js实现一个打点计时器

打点计时器

相关阅读

栏目导航

推荐阅读

热门阅读