setInterval/setTimeOut函數與for循環顯示意外的結果

Question

for (var i = 0; i <= 2; ++i) { 
    display_para(i); 
}; 

function display_para(i){ 

    setInterval(function(){ 
     console.log(i); 

     //Stuff to be done 

    }, 1500 + i * 2000); 
}; 


Expected result: 
0 1 2 ; 0 1 2; 0 1 2 and so on. 

而它顯示不同的輸出，如截圖所示。

我不明白我要去哪裏錯了。

Answer 1

這是因爲您如何設置定時器，0調用將在每隔5500ms每調用一次，每調用一次1500ms，調用1，調用2。

一種解決方案是使用地方根據你決定的值的計數器一個inteval要打印像

var i = 0; 
 
setInterval(function() { 
 
    display_para(i); 
 
    if (++i > 2) { 
 
    i = 0; 
 
    } 
 
}, 1500); 
 

 
function display_para(i) { 
 
    document.body.innerHTML += i + '<br />' 
 
};

Answer 2

你可能需要這樣：

var i = -1; 
 

 
setInterval(function() { 
 
    i = i > 1 ? 0 : ++i; 
 
    console.log(i); 
 
}, 1500)

Answer 3

因爲有三個setInterval()以不同的時間間隔同時運行，所以不能指望序列號爲0 1 2。這是唯一可能的，如果時間間隔是否均勻，如：

function display_para(i) { 
     setInterval(function() { 
      console.log(i); 
     }, 200); 
}; 

Answer 4

for循環擴展爲：

display_para(0); 
display_para(1); 
display_para(2); 

創建setInterval定時器：

log 0 every 1500 ms 
log 1 every 3500 ms 
log 2 every 5500 ms 

所以

timer 0 fires at: 1500 3000 4500 6000 7500 
timer 1 fires at:   3500  7000 
timer 2 fires at:     5500 

給予

Expected result: 0  0 1 0 2 0 1 0