setTimeOut()或setInterval()。 4种方法同样适用。哪个最好? [英] setTimeOut() or setInterval() . 4 methods to apply same thing. which is best?

查看:357
本文介绍了setTimeOut()或setInterval()。 4种方法同样适用。哪个最好?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在显示一个关于给定结束时间的倒计时手表。

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 my countdown function.

  var timerId;
  var postData = {endDate : endDate, tz : tz};  
  var countdown = function()
    { 
      $.ajax({
               type : 'post',
               async : false,
               timeout : 1000,
               url : './ajax_countdown.php',
               data : $.param(postData),
               dataType : 'json',
               success : function (resp){
                  $('#currentTime').html(resp.remainingTime);
               }
            }); 
     }

我想要的是该功能(倒计时)应自动调用每1秒后并且如果它在1秒内没有执行/完成,则取消当前的ajax并开始新的ajax调用。

what i want is that function (countdown) shoud be called automatically after every 1 second and if it does not execute/completed within 1 second then cancel the current ajax and start a new ajax call.

现在我找到了那里是 4种工作方法

window.setInterval(countdown, 1000);



方法2:独立使用 setInterval()



method 2 : using setInterval() independently

setInterval(function() {countdown()}, 1000);



方法3:在函数内部使用 setTimeOut 调用其他函数初始化主函数



method 3 : using setTimeOut inside the function an call other function to intialize main function

var countdown = function() { 
     $.ajax({ //ajax code });
     timerId = setTimeout(countdown, 5000); // assign to a variable
 }

function clockStart() {  
        if (timerId) return
        countdown();
}
clockStart(); // calling this function 



方法4:使用匿名函数调用



method 4 : using anonymous function call

var countdown = function() { 
     $.ajax({ //ajax code });
     timerId = setTimeout(countdown, 5000);
 }
  (function(){
         if (timerId) return;
         countdown();
})();

请告诉我


  • 每种方法的con和pro是什么,哪种是最佳/正确方法?

  • 我应该使用 clearTimeOut() clearInterval()

  • What is con and pro of each method and which one is best/right method?
  • Should i use clearTimeOut() or clearInterval() ?

参考

推荐答案

<使用#1而不是#2的好处是窗口引用消除了覆盖范围变量的可能性 setInterval

The benefit of using #1 over #2 is that the window reference removes the chance of a scope variable overwriting setInterval.

// When out of global scope...
function setInterval() {

}

window.setInterval(foo, 100); // still calls the "correct" setInterval

将回调包装到<$ c $之间没有区别c>倒计时在一个函数中(#1,#2)。 #2为您提供了更大的灵活性,因为您也可以调用其他函数/传递参数等(尽管如果情况如此,从#1换到#2显然是微不足道的。)

There's no difference between wrapping the call to countdown in a function (#1, #2). #2 gives you greater flexibility as you can also call other functions/ pass arguments etc (although it's obviously trivial to swap from #1 to #2 if this becomes the case).

#4保存你必须声明一个函数 clockStart ,除此之外,它与#3相同。

#4 saves you having to declare a function clockStart, other than that, it's the same as #3.

使用 clearTimeout 如果您使用 setTimeout ,并且 clearInterval 如果您使用 setInterval ...

Use clearTimeout if you used setTimeout, and clearInterval if you used setInterval...

您还应该了解 setTimeout <的方式/ code>和 setInterval 以不同的方式工作。有一个惊人的答案这里解释了......

You should also be aware of how setTimeout and setInterval work differently. There's an amazing answer here which explains that...

至于我用的是什么?我会用#2。

As for what I'd use? I'd use #2.

这篇关于setTimeOut()或setInterval()。 4种方法同样适用。哪个最好?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆