是否有返回给定音频对象状态的 javascript 方法？

Question

我正在用 javascript 编写一个简单的益智游戏。 You can play it here 和 source code is here。它使用音符作为游戏片段，您可以按“播放”按钮使其播放音符。音符在演奏时也会亮起。问题是声音和不断变化的图形之间似乎存在延迟。

对于音频播放方法this.playToneRow()，我使用了一个全局变量来遍历所有的音符，然后在显示片段的方法中，this.drawNotes()，我只是抓取了那个全局变量的值来确定哪个游戏块应该亮。但我猜这不是最好的方法，因为 .play() 调用和实际声音之间似乎存在延迟。

所以我认为控制不断变化的图形的更好方法是某种告诉当前正在播放的音频对象（如果有的话）的方法，然后我可以更改相应的图像。

this.playToneRow = function()
{
    var x = 0,
        length = (this.notes.length + 2),
        myArray = this.notes;
    j = 0;
    currentSound = this.player;

    function runIteration () {
        x = myArray[j];

        setTimeout(function()
        {
            if (typeof x === 'number')
            {
                noteSound[x].play();
            }
        }, 500);

        if (j === length)
        {
            j = -1;
            currentSound = 0;
            return;
        }

        j++;

        setTimeout(runIteration, 500);
    }

    runIteration();

};

this.drawNotes = function()
{
    this.noteText = "";
    for (var i = 0; i < 12; i++)
    {
        this.noteText += noteNames[this.notes[i]];
        this.noteText += ", ";
        if (((j - 3)  === i) && (currentSound === this.player))
        {
            ctx.drawImage(this.gamePieceHi, (i * 52) + 85, 275 - (this.notes[i] * 17.7));
        }
        else
        {
            ctx.drawImage(this.gamePiece, (i * 52) + 95, 285 - (this.notes[i] * 17.7));
        }
    }
};

Answer 1

似乎this.playToneRow() 从现在开始通过setTimeout() 将声音排队500 毫秒，但绘制音符的部分正在立即运行。