javascript - VueJS setTimeout 没有设置超时

Question

我正在尝试使用setTimeout分别播放声音。我有一个名为 challenge 的数组，它具有(用于测试目的)[0,1,2,3] 以及一个 play(n, true ) 用于启动声音，play(n, false) 用于停止声音。我想做的是:

• play(0, true).wait1seconds.play(0,false).wait1seconds
• play(1, true).wait1seconds.play(1,false).wait1seconds等了这么久。

到目前为止我所写的是:

watch: {
    turn: function(turn) {
        if (this.turn === 0) {
            var self = this;
            var time = 500;
            var timeArray = [[],[]]; // I tried with and without this array
            for (var i = 0; i < this.challenge.length; i ++) {
                timeArray[0][i] = setTimeout(function() {
                    self.play(i, true);
                }, time);
                timeArray[1][i] = setTimeout(function() {
                    self.play(i, false);
                    this.time += 1500; //  // I tried with and without this
                }, time + 1000);
            }
        }
    }
}

如果没有阵列，我只是一次播放所有内容，偶尔发出我能够检测到的声音。对于数组来说，这只是对象错误。

Answer 1

如果稍后不需要引用超时，为什么还要创建数组？您可以“手动”将计时器间隔 1 秒

// mocking code:
var challenge = [0, 1, 2, 3];

for (let i = 0; i < 2 * challenge.length; i++) {
  setTimeout(function() {
    play(Math.floor(i / 2), i % 2 === 0);
  }, 1000 * i);
}

function play(audioIndex, playAction) {
  if (playAction) {
    console.log("playing audio: " + audioIndex);
  } else {
    console.log("stopping audio: " + audioIndex);
  }
}