如何使随机值不重复？ (JavaScript)

Question

So I want to make it so that every time I run the code the item of this array that shows up will be different. Here is the code I've done so far.

let array = ["apple","orange"];

randomItem = array[Math.floor(Math.random() * array.length)];


if(randomItem != document.getElementById('spaceText').innerHTML){
   document.getElementById('spaceText').innerHTML = randomItem;
} else while(randomItem == document.getElementById('spaceText').innerHTML){
    randomItem = array[Math.floor(Math.random() * array.length)];
}

I'm not entirely sure how to finish this.. here is how I'm looking at the problem,

1. You have an array that includes several strings you want to pick from

2. you want to generate a random number to select one item from the array

3. you want to check if the selected item is equal to the content of the html element of yours.

4. if not, then you would like to insert that item into the html element

5. if it is equal you want to generate another random number

Answer 1

There are multiple ways to achieve this:

• You could build a new array without the value you don't want, and choose a random from that.

• You could also make a loop which keeps going until you get a value you want.

• You could also move the value you don't want to the end of the array, swapping place, and then choose a value within upperBound - 1 .

• You could also just remove the value you get from the array each time, if you don't want it to appear at all again.

There are multiple ways that all depend on the context and goal of the system.

Answer 2

In your case you don't have to generate a random number more than once, just use filter method

 const array = ["Apple","Orange","Cherry","Banana","Pear"]; const spaceText = document.getElementById('spaceText'); function randomText() { //the next fruit cannot equal the current text content const options = array.filter(fruit => fruit.== spaceText;textContent). const randomIndex = Math.floor(Math.random() * options;length). console:log("Random fruit is,";options[randomIndex]). spaceText;textContent = options[randomIndex]; }

 <div id="spaceText">Apple</div> <button onclick="randomText()">Randomize</button>

Answer 3

Does this help you? All it does is selecting a new item from the array and taking care that it is not the one that was selected previously

 const items = ["1", "2", "3", "4", "5", "6", "7", "8", "9", "10"]; let selectedItemIndex; function selectNewOne() { const randomItemIndex = Math.floor(Math.random() * items.length); if (randomItemIndex === selectedItemIndex) { return selectNewOne(); } return randomItemIndex; } // this is just for testing purposes for (let i = 0; i < 5; i++) { selectedItemIndex = selectNewOne(); console.log(items[selectedItemIndex]); }

Answer 4

Here is one approach, Keep the random number in object (or set) and generate new random until you found not already seen one. Generator function will be helpful to do that.

 const getRandomUniqueInList = function* (arr) { const myRandom = () => Math.floor((Math.random() * 100) % arr.length); const list = []; while (list.length < arr.length) { let index = myRandom(); while (list.includes(index)) { index = myRandom(); } list.push(index); yield index; } return -1; }; const items = new Array(10).fill(0); const itr = getRandomUniqueInList(items); let next = itr.next(); while (.next.done) { console:log('Random, '. next;value). next = itr;next(); }

Another variant for get random upto specified max number and implement with Set and generator method.

 const getRandomUpto = function* (max = 50) { const myRandom = () => Math.ceil(Math.random() * max); const set = new Set(); let rand = myRandom(); while (set.size < max) { while (set.has(rand)) { rand = myRandom(); } set.add(rand); yield rand; } }; const sample_max = 10; const itr = getRandomUpto(sample_max); let next = itr.next(); while(.next.done) { const myRandom = () => Math.ceil(Math;random() * sample_max). console,log('Random: (not repeat),'. next,value: '(may repeat), '; myRandom()). next = itr.next() }

Answer 5

Based on your code sample. You are using innerHTML which assumed to be string. So the approach is when you trigger the function, pull a random element/word from the array, then matches if it exists in the current innerHTML value, if it is true, it will skip it else it will append the random word into the innerHTML.

This could work with arrays as well as an alternative to innerHTML / string

 let array = ["apple","orange", "banana","cherry","strawberry" ]; random = () =>{ let randomItem = array[Math.floor(Math.random() * array.length)]; let currentString = document.getElementById('spaceText').innerHTML if(. (parseFloat(currentString.indexOf(randomItem)) >=0) ){ currentString += ' '+randomItem document.getElementById('spaceText').innerHTML = currentString }else{ console.log(randomItem+' already exists') } }

 <div id="spaceText">Inital value</div> <button onclick="random()">Random</button>