在循環中調用setTimeout時無法按預期工作

Question

以下JavaScript應該（在我的腦海中）以0.5秒爲間隔播放一系列音符。但它把它們全部作爲一個同時演奏的和絃來演奏。任何想法如何解決它？

function playRecording() { 
    if (notes.length > 0) { 
     for (var i = 0; i < notes.length; i++) { 
      var timeToStartNote = 500 * i; 
      setTimeout(playNote(i), timeToStartNote); 
     } 
    } 
} 

function playNote(i) { 
    var noteNumber = notes[i]; 
    var note = new Audio("/notes/note_" + noteNumber + ".mp3"); 
    note.play(); 
} 

Answer 1

很簡單實際上，在for循環中調用，其播放音符瞬間我（因此玩很多音符瞬間像和絃，因爲它是在一個非常快的循環運行）功能playNote(i)。相反，你應該嘗試編碼，讓超時實際上播放音符。 setTimeout函數期望函數作爲參數，而不是您調用的函數。

(function(j){setTimeout(function(){playNote(j);},j*500);}(i)); 

Answer 2

JavaScript的關閉，在自動執行功能把這個包：

for (var i = 0; i < notes.length; i++) { 
    (function(i) { 
     var timeToStartNote = 500 * i; 
     setTimeout(function() { 
      playNote(i) 
     }, timeToStartNote); 
    })(i) 
} 

Answer 3

感謝鄉親，這裏是完整的解決方案，我的問題：

function playRecording() { 
    if (notes.length > 0) { 
     for (var i = 0; i < notes.length; i++) { 
      playNote(i); 
     } 
    } 
} 

function playNote(i) { 
    setTimeout(function() { 
     var noteNumber = notes[i]; 
     var note = new Audio("/notes/note_" + noteNumber + ".mp3"); 
     note.play(); 
    }, 500 * i); 
}