Question

我有一个简单的div，应该在单击时播放随机声音。我将声音存储在这样的对象数组中：

var sounds = [
  {
    animalType: 'horse',
    sound: new Audio('../sounds/Horse-neigh.mp3')
  },
  {
    animalType: 'bear',
    sound: new Audio('../sounds/grizzlybear.mp3')
  },
  {
    animalType: 'goat',
    sound: new Audio('../sounds/Goat-noise.mp3'),
  }
]

然后当我将其随机化时，会出现以下错误：sound.play is not a function

这是我将其随机化的尝试：

 var player = document.getElementById('player');

 player.addEventListener('click', function() 
 var sound = sounds.sort( () => Math.random() - 0.5)
 sound.play()
})

为什么会给我这个错误，如何使它起作用？当它只是一个数组时，它可以工作，但是当将一个数组与对象一起使用时，它不起作用。

Answer 1

[EDIT]我已经制作了一个有效的示例here。

随机化声音数组的索引更为简单。下面的示例：

var player = document.getElementById('player');

player.addEventListener('click', function() 
    var sound = sounds[Math.floor(Math.random()*sounds.length)]; 
    sound['sound'].play() //acessing "sound" element from your randomized object
})

Answer 2

不要随机化列表的顺序，只需从列表可能的索引范围中选择一个随机数即可。然后相应地调整行为，以确保它不会一次又一次地播放相同的声音（由于列表很小，很可能会发生）。

Answer 3

因为sound不包含对象之一，而是整个数组。

尝试sound[0]选择一个实际的声音对象：）

Answer 4

在数组上使用.sort不会返回该数组的单个元素，而是返回所有元素的数组（已排序）。您期望.sort返回数组中的单个元素。 mdn sort method。

您需要的是

 var animal = sounds[Math.floor(Math.random() * sounds.length)]

if ( ! animal ) {
   sounds[0].sound.play();
} else {
   animal.sound.play()
}

!animal的原因是Math.floor(Math.random() * sounds.length)超出了声音数组绑定范围的情况

Answer 5

根据我的观察，您在以下代码中的上述用法中有1个错误让我知道您是否仍然遇到相同的错误：

var sound = sounds[Math.floor(Math.random()*sounds.length)];
sound.play()

或

var sound = sounds.sort( () => Math.random() - 0.5),
sound.play()

错误是随机的{（）=> Mth.random（）-0.5 }进程，如果仍然无法消除随机函数而无法检查。...

如何用对象随机化数组

5 个答案: