foreach中的Javascript setTimeout：需要幫助創建一個閉包

Question

我有這個功能

notes.forEach(function(note) {          
    setTimeout(function() {
        playNote(note);
    }, 1000);
});

這不起作用。 它同時播放所有音符，而不是按順序播放它們之間的間隔為1秒。 看起來我需要在這里使用一個閉包來完成這項工作。 有人可以幫我修復這個功能，所以它會播放每個音符之間的延遲音符嗎？

Answer 1

有兩種方法可以做到這一點：

1）具有每秒抓取一個音符的功能，直到沒有其他音符為止：

var interval = setInterval(function() {
  playNote(notes.shift()); // changes the notes array!
  if (!notes.length) clearInterval(interval);
}, 1000);

2）以不同的延遲同時啟動所有計時器：

notes.forEach(function(note, index) {
  setTimeout(playNote.bind(null, note), index*1000);
});

Answer 2

因為所有超時都是同時設置的...

做這樣的事情：

playAllNotes(0);
function playAllNotes(index) {
    if(notes.length > index) {
        setTimeout(function() {
            playNote(notes[index]);
            playAllNotes(++index);
        }, 1000);
    }
}

Answer 3

你可以使用一個計數器，這很棘手但是如果你正在處理對象是值得的：

counter = 0;
$.each(object, function(index,item){
  counter++;
  var localCounter = counter;
  setTimeout(function{
   console.log('something')
  }, counter * 1000) // change one to number of milliseconds you need
})

第一個計數器是全局的，所以如果我們不使用var localCounter我們將同時執行所有超時。