随机选择数组项没有删除项目没有重复项（JavaScript）

Question

我看到很多关于随机选择数组项没有重复的问题。然而，他们中的大多数是通过拼接方法来回答的。但是这会删除项目。

我已经随机选择了我的物品，但它们正在重复。在我的两个功能中，我从每个随机选择的项目中选择两个“子项目”。这两个函数不能一起工作，我正在寻找一种方法，可以选择两个不同的随机选择的项目，而不必重复，也不需要删除它们。有人可以帮我吗？

（使用Adobe Edge Animate中）

var xml_source = "series.xml"; 
 
var initLoadScript = false; 
 

 
var items = []; 
 
var itemTitle1; 
 
var obj = new Object(); 
 
var previousNumber = -1; 
 

 
loadXML(); 
 

 
function loadXML() { 
 
\t $.ajax({ 
 
\t \t type: "GET", 
 
\t \t url: xml_source, 
 
\t \t dataType: "xml", 
 
\t \t success: function(xml) { 
 

 
\t \t \t $(xml).find('sbs').find('channel').find('item').each(function() { 
 
\t \t \t \t items.push($(this)); 
 
\t \t \t }); 
 

 
\t \t \t itemOne(); 
 
\t \t \t itemTwo(); 
 
\t \t } 
 
\t }); 
 
} 
 

 
function itemOne(){ 
 
\t var randomNumber = Math.floor(Math.random()*14); 
 
\t var assignItem = randomNumber; 
 
\t console.log("random nummer 1: " + assignItem); 
 
\t sym.$("TitleText1").html(items[assignItem].find("author_name").text()); 
 
\t sym.$("Image1").html("<img src='"+items[assignItem].find('media\\:content, content').find('media\\:thumbnail, thumbnail').attr('url')+"' width='145'/>"); 
 
} 
 

 
function itemTwo(){ 
 
\t var randomNumber = Math.floor(Math.random()*14); 
 
\t var assignItem = randomNumber; 
 
\t console.log("random nummer 2: " + assignItem); 
 
\t sym.$("TitleText2").html(items[assignItem].find("author_name").text()); 
 
\t sym.$("Image2").html("<img src='"+items[assignItem].find('media\\:content, content').find('media\\:thumbnail, thumbnail').attr('url')+"' width='145'/>"); \t 
 
}

XML结构的例子：

<?xml version="1.0" encoding="UTF-8" ?> 
 
<sbs version="1.0" xmlns:media="http://search.yahoo.com/mrss/"> 
 
<channel> 
 
    <title>Feed</title> 
 
    <description>Video</description> 
 
    <link>//www.URL.com</link> 
 
    <lastBuildDate>Fri</lastBuildDate> 
 
    <pubDate>Fri</pubDate> 
 
    <ttl>1</ttl> 
 
    
 
     
 
    <item> 
 
    <title>title</title> 
 
    <description>aflevering</description> 
 
    <link>//www.google.com</link> 
 
    <guid>//www.google.com</guid> 
 
    <formatname>berg</formatname> 
 
    <pubDate>Wed</pubDate> 
 

 
    <!-- oEmbed --> 
 
    <oembed> 
 
    <version>1.0</version> 
 
    <type>video</type> 
 
    <provider_name>provider</provider_name> 
 
    <provider_url>http://www.video.nl/url</provider_url> 
 
    <width>10</width> 
 
    <height>10</height> 
 
    <title>title1</title> 
 
    <author_name>author name</author_name> 
 
    <author_url>http://www.google.com/</author_url> 
 
    </oembed> 
 

 
    <media:content 
 
     url="http://google.com" 
 
     type="text/html" 
 
     medium="document" 
 
     expression="full" 
 
     height="10" 
 
     width="10" 
 
     lang="us"> 
 
     <media:title type="plain">title</media:title> 
 
     <media:description type="plain">title descr</media:description> 
 
     <media:thumbnail url="http://google.com/tiger.jpg" width="10" height="10" /> 
 
    </media:content> 
 

 
    </item>

Answer 1

我没有得到很好的你想要什么来实现的，但这里有一个方法我会得到随机的物品一旦

var letters = ["A", "B", "C", "D", "E", "F", "G", "H", "I", "J", "K", "L", "M", "N"]; 
var getRandom = (function (array) { 
    var notGivenItems = array.map(function (el) {return el;}), 
    var getIndex = function() { 
     return Math.floor(Math.random() * notGivenItems.length); 
    }; 

    return function() { 
     if (notGivenItems.length === 0) { 
      return; 
     } 

     return notGivenItems.splice(getIndex(), 1)[0]; 
    }; 
})(letters); // items, in your case 

getRandom(); // some letter 
getRandom(); // some other letter 
... 
getRandom(); // different letters until all are given 

// if the method is called more times than the array length it'll return undefined 

编辑： 改进性能由于@JLRishe评论

Answer 2

尝试

var items = [] 
, res = null 
, dfd = new $.Deferred()  
, processItems = function (item) { 
    var index = $.inArray(item, items); 
    console.log("random number: " + index); 
    $("<div />", { 
     "class": "TitleText", 
     "html": $(item).children().find("author_name")[0].innerHTML, 
     "data-index": index 
    }) 
    .add("<br />") 
    .add(
     $("<div />", { 
      "class": "Image", 
      "data-index": index, 
      "html": $("<img />", { 
       "class": "Image", 
       "data-index": index, 
       "src": $(item).children() 
        .filter("media\\:content") 
        .children("media\\:thumbnail") 
        .attr("url") + "?" + $.now(), 
       "width": "145" 
      }) 
     }) 
    ) 
    .appendTo(".items") 
} 
, loadXML = function() { 
     return $.post("/echo/xml/", {xml:xml}, "xml") 
     .then(function(xml) { 
      $(xml.documentElement) 
      .find("item") 
      .each(function(i, el) { 
       items.push(el) 
      }); 
      return items 
     }) 
}; 

loadXML() 
.then(function(data) { 
    $.each(data, function(i, item) { 
     setTimeout(function() { 
      // select different randomly selected items, 
      // without repetition 
      processItems(item); ++res; 
      if (res === data.length) { 
       dfd.resolve(res + " items processed"); 
      } 
     }, 1 + Math.floor(Math.random() * 25)); 
    }); 
    return $.when(dfd, data) 
}, function(jqxhr, textStatus, errorThrown) { 
    console.log(textStatus, errorThrown) 
}) 
.then(function(msg, data) { 
    console.log(msg, data) 
}); 

的jsfiddle http://jsfiddle.net/guest271314/o5tfs48r/

Answer 3

如果您想按随机顺序浏览数组而不修改原始数组：

1. 使用ary.slice()复制数组（这将复制数组，但不复制它们的值，如果它们是对象的话）。
2. 随机拷贝。
3. 遍历副本。

var items = ["a", "b", "c", "d", "e", "f", "g"]; 
 

 
var copy = getShuffledCopy(items); 
 
copy.forEach(function (el) { 
 
    console.log(el); 
 
}); 
 

 

 

 
function getShuffledCopy(ary){ 
 
    var copy = ary.slice(); 
 
    shuffle(copy); 
 
    return copy; 
 
} 
 

 
function swap(ary, pos1, pos2) { 
 
    var tmp = ary[pos1]; 
 
    ary[pos1] = ary[pos2]; 
 
    ary[pos2] = tmp; 
 
} 
 

 
function shuffle(ary){ 
 
    // Fisher-Yates shuffle 
 
    for(var i = ary.length - 1; i >= 1; i -= 1) { 
 
     swap(ary, Math.floor(Math.random() * i), i); 
 
    } 
 
}