倒计时

背景

记得以前在老东家曾经遇到的坑，前几天有朋友提起，记录一下。

setInterval

大多数人说起倒计时都会想起 setInterval ，包括以前的我。比如倒计时 60 秒

var time = 60;var timer = setInterval(function(){   if( --time > 0 ){       console.log( time );   }else{       console.log( 'finish' );       clearInterval(timer);   }},1000)

这种写法咋一看没问题，仔细看还没看不出问题。。
时间一长就出bug了。
做个小实验， 在 console 丢下代码， 代码只有 4 行，然后观察 console 输出

var counter = 0;  // 作为参照setInterval(function(){     console.log( ++counter % 60,new Date().getSeconds(), new Date().valueOf() );},1000)

ok，代码开始跑了。然而这个时候我开始看游戏直播了，反正这玩意短时间看不出结果的。偶尔回头看看代码运行的情况

当看着 3 3 5 5 7 7 9 9 11 11 13 13 的时候。 我好慌

另外的思路

var Timer = function(sec,callback){   this.second = sec;                       // 倒计时时间（单位：秒)   this.counter = 0;                        // 累加器，存储跳动的次数   this.timer = null;                       // setTimeout 实例   this.before = (new Date()).valueOf();    // 开始时间 -- 时间戳，用于比较   this.loop = function(){                  // 开始倒计时       this.timer && clearTimeout(this.timer);       var _this = this;       this.counter++;       var offset = this.counter * 1000 - (new Date()).valueOf() + this.before, // 倒计时每秒之间的偏差           ctimestamp = this.second - this.counter;                             // 实际剩余秒数       this.timer = setTimeout(function(){           if( ctimestamp visibilitychange 的时候重新向服务器请求计时时间#JavaScript、timer、this、console#

版权声明

本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处。如若内容有涉嫌抄袭侵权/违法违规/事实不符，请点击 举报 进行投诉反馈！