开发者

How to know if a timer is cleared or timed out in javascript?

Ok, really simple question. I'm taking a crash course in javascript.

If I use timer = setTimeout(..., 500) to set a timer, and then clearTimeout(timer) to clear the timer, the integer value of timer doesn't change, so my question is how to know if a timer is timed out or cleared?

I want to use if (timer) {...} , but obviously a pos开发者_StackOverflow中文版itive integer always returns true.


If you're looking for something more formal, you could build javascript class that encapsulates the setTimeout/clearTimeout functionality.

Such a class might look something like this:

/** class Timer **/
var Timer = function(delayMs, callbackFunc) {
    this.delayMs = delayMs;
    this.callbackFunc = callbackFunc;
    this.timerState = 'new';
}
Timer.prototype.start = function() {
    if( this.tmr ) return;

    var self = this;
    this.timerState = 'running';
    this.tmr = setTimeout(function() { self._handleTmr(); }, this.delayMs);
}
Timer.prototype.cancel = function() {
    if( ! this.tmr ) return;

    clearTimeout(this.tmr);
    this.tmr = null;
    this.timerState = 'canceled';
}
Timer.prototype._handleTmr = function() {
    this.tmr = null;
    this.timerState = 'completed';
    this.callbackFunc();
}

I've also included a timerState attribute that would let you easily determine whether the timer was "completed" or "canceled".

You would use it like this:

var t = new Timer(500, function() {
    alert('timer completed');
});
t.start();

// do whatever...

// now cancel the timer if it hasn't completed yet.
t.cancel();

// maybe you do some other stuff...
// then check the timerState, and act accordingly.
//
if( t.timerState == 'canceled' ) {
   alert("the timer was canceled!");
} else {
   alert("the timer completed uneventfully.");
}

You can extend the same basic idea to include additional functionality if you need it (eg. repeating timer, start/stop/resume, etc.)


assign null to the timer after the clearTimeout(timer)


If you clear the timeout the callback won't be executed. So if the callback is executed it means that 500ms have passed since you've set the timeout.

For example:

var timer = setTimeout(function() {
    alert('you will never see this alert');
}, 500);
clearTimeout(timer);


Here is something that I use for timer events! Hope this helps.

    var toggleTimeOut   = (function () {

    var _timeout;

    return function (clear_timeout) {

      if(!clear_timeout) 
      {
        _timeout    =   setTimeout( function () {/*DO YOUR STUFF*/}, 5000);
      }
      else
      {
        if(typeof _timeout != typeof undefined && _timeout != 0)
        {
            clearTimeout(_timeout);
            _timeout= 0;
        }
      }
    }
  })();


I avoid using flags in JS in general but this is a case where it makes sense and keeps things nice and simple. The idea is you set a flag once your timer has fired and then you can examine that elsewhere in code.

let fired = false;

// Set your timeout to do future work...
const timeout = window.setTimeout(() => {
    fired = true;
    // ...
}, 3000);

// Test it
const testInterval = window.setInterval(() => {
    console.log(`Timer has ${fired ? ' ' : 'not '}fired`);
    fired && window.clearInterval(testInterval);
}, 500);

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜