如何通過緩動來增加javascript循環延遲

Question

我需要從1增加到60，但我想用緩動來計數，所以例如它會從1到30延遲100ms，之後我需要增加延遲，所以當它達到60.這計數將逐步放緩是我走到這一步，（不要太多）：

var i = 0; 
var interval = setInterval(function(){ 
    i += 1; 
    console.log(i); 
    if(i == 60) { 
     clearInterval(interval); 
    } 
}, 100); 

Answer 1

我會用setTimeout()，像這樣：

var delay = 100, count = 0; 
function delayed() { 
    count += 1; 
    console.log(count); 
    if (count > 30) { 
     delay += 10; 
    } 
    if (count < 60) { 
     setTimeout(delayed, delay); 
    } 
} 
delayed(); 

A live demo at jsFiddle。

Answer 2

以下是您可以使用的東西。數學在動作A位

var i = 0, a = 0; 
var interval = setInterval(function(){ 
    i += 1; 
    a = parseInt(Math.log(i)*Math.log(i)*100, 10); 
    print(i, a); 
    if(i == 60) { 
     clearInterval(interval); 
    } 
}, 100); 

function print(i, a){ 
    setTimeout(function(){ 
     console.log(i) 
    },a); 
} 

基本上，a值將逐漸增加。您可以觀察到時間差異很小的i打印的計數

Answer 3

爲什麼不連續減速？在我看來，這看起來好多了。我相應地更新了@Teemu的答案。請參閱this fiddle。

var delay = 0, count = 0; 
function delayed() { 
    count += 1; 
    console.log(count); 
    //adjust to influence overall speed 
    delay+=5; 
    if (count <60) { 
     setTimeout(delayed, delay); 
    } 
}