setTimeOut() or setInterval() . 4 methods to apply same thing. which is best?

后端 未结 3 498
自闭症患者
自闭症患者 2020-12-18 06:09

I am displaying a countdown watch with respect to a given endtime.

although its working perfect but i want to know which is best methods to apply.

below is m

3条回答
  •  一生所求
    2020-12-18 06:52

    I wouldn't use any of your methods. The reason is setTimeout and setInterval do not guarantee that your code will execute after the specified delay. This is because JavaScript is single threaded.

    If I need to call a function only once after a specified delay then I use setTimeout. However if I need to call a function after a fixed interval of time then I do not use setInterval. Instead I make use of delta timing. Here's the code.

    The advantage of using delta timing is that your code will execute closer to the fixed interval of time you specify. It corrects itself. Creating and using a delta timer is simple. For example your code would be written as follows:

    var timer = new DeltaTimer(function (time) {
        $.ajax({
            // properties
        });
    
        if (time - start >= 5000) timer.stop();
    }, 1000);
    
    var start = timer.start();
    

    The above delta timer is better than setInterval (method 1), makes use of setTimeout (method 2) but also corrects itself, starts the timer using a function (method 3), and doesn't pollute the scope with a special clockStart function (method 4).

    In addition you can easily get the exact time the function is called after the timer starts as the time the function is called is passed as an argument to the function. The timer also has a stop method to stop the timer. To start it again call start again.

    Edit:

    If you want to make the DeltaTimer look more like setInterval (start the timer automatically) you may implement a spawn function as follows:

    DeltaTimer.spawn = function (render, interval) {
        var timer = new DeltaTimer(render, interval);
    
        var start = timer.start = function (start) {
            return function () {
                render.start = start();
            };
        }(timer.start);
    
        start();
    
        return timer;
    };
    

    Then you may automatically create and start the DeltaTimer as follows:

    var timer = DeltaTimer.spawn(function countdown(time) {
        $.ajax({
            // properties
        });
    
        if (time - countdown.start >= 5000) timer.stop();
    }, 1000);
    

    Thus var timer = DeltaTimer.spawn(funct, delay); is equivalent to var interval = setInterval(funct, delay); and timer.stop(); is equivalent to clearInterval(interval);. I guess that's as much as you can automate it.

提交回复
热议问题