HTML5 Audio не работает с методом setTimeout

function singPattern(compPattern) {
    var audio; // There is only one audio
    for(let i=0; i<compPattern.length; i++) {

        //everytime in this loop audio is assigned to the "Audio" 
        //  the old one is off to the pasture. (dead)(GC) 
        audio = new Audio("../../music-files/" + compPattern[i] + ".mp3");
        window.setTimeout(function () {
            audio.play();
        }, 2000);
    }
}

Как и во всех javascript, есть несколько способов справиться с этим.

вы можете передать объект в таймаут, как это. и тайм-аут будет закрывать объект.

function singPattern(compPattern) {
    for(let i=0; i<compPattern.length; i++) {
        // I will just print the word but you can pass the object in. 
        var audio = compPattern[i] + ".mp3";
        window.setTimeout(function (_audio) {
            console.log(_audio)
        }, 2000, audio);
    }
}

Если вам нужен доступ к объекту Audio вне setTimeout, чтобы отменить/воспроизвести его, вы можете настроить такой словарь:

function singPattern(compPattern) {
    var audio ={};
    for(let i=0; i<compPattern.length; i++) {       
        audio[compPattern[i]] = compPattern[i] + ".mp3";        
    }
    setTimeout(function(){
       for( var a in audio ){ console.log( "play ", a , audio[a] ); } 
    },2000);
    // audio['green'].pause() ?     
}

редактировать

Heres рабочий образец с внешними mp3s

function singPattern(compPattern) { 
  for (let i = 0; i < compPattern.length; i++) {  
    var audio = compPattern[i];         
    setTimeout(function (_audio) { 
      var sound = new Audio(_audio); 
      console.log("Playing " + _audio);
      sound.play(); 
    }, 2000, audio); 
  } 
}

var soundUrls = ["http://soundbible.com/mp3/Stream Noise-SoundBible.com-866411702.mp3", "http://soundbible.com/mp3/Strange_Days-Mike_Koenig-176042049.mp3"];

singPattern(soundUrls);