setTimeOut()或setInterval()。 4种方法同样适用。哪个最好? [英] setTimeOut() or setInterval() . 4 methods to apply same thing. which is best?
问题描述
我正在显示一个关于给定结束时间的倒计时手表。
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()
orclearInterval()
?
参考
推荐答案
<使用#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屋!