如何访问数组中随机对象的属性？

Question

我有一个对象数组。它们中的每一个都具有与其他属性相同的属性，但值不同。我想访问这个数组中一个随机对象的属性，但只访问一次，所以当我随机获取该对象时，它将不再在数组中。

因此，我以三个对象作为数组的开始，并创建一个函数，该函数将通过单击按钮来调用。该函数创建2个变量-一个用于存储从Math.random（）与数组长度的乘法中接收的随机数，并由Math.floor（）取整。

第二个变量存储从数组中删除的一个项目（每次都是随机的），并且应该返回它。

这种想法是每当用户点击按钮获得一张独特的卡片时，就不能再获得相同的卡片。它可以工作，但不完全正确-有时，在单击按钮后，用户什么也得不到，控制台中的消息是“UncaughtTypeError:无法读取未定义的属性'background'。

欢迎任何建议。谢谢

这是我的代码：

var TarotContainer = [];
TarotContainer[0] = {name: "The Fool", background: "url('theFool.jpg')"}
TarotContainer[1] = {name: "The Magician", background: "url('theMagician.jpg')"}
TarotContainer[2] = {name: "The High Priestess", background: "url('theHighPriestess.jpg')"}

function getRandomTaroCard(){
    var randomCard = Math.floor(Math.random() * TarotContainer.length); 
    var pickedRandomCard = TarotContainer.splice(randomCard, 1);
    document.getElementById('card').style.backgroundImage = pickedRandomCard[randomCard].background;
    document.getElementById('card').style.backgroundRepeat = "no-repeat";                                                         

}

Answer 1

从Mozilla Javascript参考Array.prototype.splice（）返回的内容：

包含已删除元素的数组。如果只删除一个元素，则返回一个元素的数组。如果没有删除任何元素，则返回空数组。

这意味着您必须获取pickedRandomCard的第一个元素（[0]）。

像这样：

var TarotContainer = [];
TarotContainer[0] = {name: "The Fool", background: "url('theFool.jpg')"}
TarotContainer[1] = {name: "The Magician", background: "url('theMagician.jpg')"}
TarotContainer[2] = {name: "The High Priestess", background: "url('theHighPriestess.jpg')"}

function getRandomTaroCard(){
    var randomCard = Math.floor(Math.random() * TarotContainer.length); 
    var pickedRandomCard = TarotContainer.splice(randomCard, 1);
    document.getElementById('card').style.backgroundImage = pickedRandomCard[0].background;
    document.getElementById('card').style.backgroundRepeat = "no-repeat";