数组中的唯一随机项答案

【问题标题】：Unique random item from array数组中的唯一随机项
【发布时间】：2017-09-04 16:34:55
【问题描述】：

在 JavaScript 中，我想从数组中随机删除一个项目，并在单击按钮时将其显示在 HTML 中。然后在下一次单击按钮时显示从数组中删除的下一个项目。但是，这似乎不起作用！

document.getElementById("Button").onclick = function() {
  var count = 3;
  var myArray = [
    'A',
    'B',
    'C',
    'D',
    'E',
    'F',
    'G'
  ];
  var tmpArrayE = myArray.slice(myArray);
  var goE = [];

  for (var i = 0; i < count; i++) {
    var optionsE = Math.floor(Math.random() * tmpArrayE.length);
    var removedE = tmpArrayE.splice(optionsE, 1);

    goE.push(removedE[0]);
  }
  document.getElementById("Answer").innerHTML = goE[0];
}

【问题讨论】：

您想从原始列表中删除该元素吗？还是只显示列表中的随机元素？
slice 用于获取数组的一部分作为新数组。但是你想用myArray.splice(myArray)做什么？
可能删除了 E 而不是 goE[0]
您希望每个元素只显示一次，还是可以重复？

标签： javascript arrays random unique

【解决方案1】：

您正在事件处理程序中重新定义您的数组，因此您的数组永远不会为空！

这是您的更新代码：

// myArray initial content, as a global variable : 
  var myArray = [
    'A',
    'B',
    'C',
    'D',
    'E',
    'F',
    'G'
  ];

  // the event handler, randomly emptying myArray one at a time : 
  document.getElementById("Button").onclick = function() {
    // check for an empty array : 
    if (myArray.length > 0) {
      var optionsE = Math.floor(Math.random() * myArray.length);
      var removedE = myArray.splice(optionsE, 1);
      document.getElementById("Answer").innerHTML = removedE[0];
    } else {
      alert("the array is now empty");
    }
}

Updated JSFiddle

【讨论】：

【解决方案2】：

您在 onclick 函数中声明 myArray。所以每次点击都会创建一个新数组。

var myArray = [
  'A',
  'B',
  'C',
  'D',
  'E',
  'F',
  'G'
];
document.getElementById("Button").onclick = function() {
  //check if myArray length is greater than 0
  if (myArray.length > 0) {
    // generate random number
    var optionsE = Math.floor(Math.random() * myArray.length);
    // remove that element & show in div
    var removedE = myArray.splice(optionsE, 1);
    document.getElementById("Answer").innerHTML = removedE;
  }

}

<button id="Button">
  Start
</button>
<div id="Answer">
  Result
</div>

【讨论】：

这太完美了，谢谢，出于某种原因，我什至没有想到将数组放在函数之外！将它移到函数之外解决了所有问题谢谢！！！

【解决方案3】：

如果您喜欢使用myArray 的副本，则需要将此行移到回调之外，因为您总是会为每个事件获得一个（新的）副本。

var tmpArrayE = myArray.slice(0); // myArray.slice(myArray) is wrong.

要在回调中使用原始数组，您可以使用myArray。

【讨论】：

【解决方案4】：

A 计划：从改组数组开始。然后在需要时弹出最后一个元素。

Plan B：从 0 到 len-1 中选择一个随机元素。将最后一个元素复制到该插槽中。然后将数组缩短一。

如果您需要“洗牌”功能，请执行此操作（仅 N 步；结果是随机的）：

for j = 0..N-1
     swap item #j with item # rand(0..N-1)

【讨论】：