如何使用数组中的随机元素，从数组中删除该元素，并继续使用随机元素直到数组为空？

Question

This is my first stack overflow question, so if I am presenting something wrong, please let me know. I am pretty new to computer programming, so I just have a small webpage where I am just implementing things that I am learning.

I made a little quiz with random trivia multiple choice questions you can take if you press a button. I am using window prompts to ask the questions and get the answers, and I have all of the questions and answers stored as objects with question/prompt and answer pairs. All of those objects are stored in an array in a variable called shortQuizPrompts. I already have the quiz working and everything, aka., It tells you after every question if you got the answer to that question right or wrong, and it gives you a grade afterwards... I also have it set up so that if you enter an answer that is not "a", "b", "c", or "d", it lets you know that it isnt a valid answer. Those sorts of things.

As of right now, you can choose how many questions long you want the quiz to be out of the 24 total questions I have so far. It just asks the questions in the order that they are stored in the array. For example, you will never be asked the last question in the array if you do not choose for the quiz to be the full 24 questions long. However, I want to make the quiz ask the questions in a random order, while also removing those questions from the array as to not ask the same question multiple times.

I have tried increasing the iterator while looping through the array to a random number from 0 to the length of however many questions they chose. Then checking to see if the iterator was larger than the length of the number of questions they chose, it would decrease the iterator until it found a question that is still in the array that it could ask...

If anyone knows how to go about doing that, it would be great. Sorry for the long question btw. I am pretty new to coding, so this is probably a simple answer, but I digress. I'm pretty sure I did everything right. Thx.

 const quizButton = document.getElementById("quiz-button"); /* ========================= Question and answer pairs ========================= */ let shortQuizPrompts = [{prompt: "10 + 10\n(a) 10\n(b) 15\n(c) 20\n(d) 25", answer: "c"}, {prompt: "What status did astronomers downgrade Pluto to in 2006?\n(a) Dwarf Planet\n(b) White Dwarf\n(c) Black Dwarf\n(d) Dwarf Star", answer: "a"}, {prompt: 'What tart fruit has a sweet variety called "Meyer"?\n(a) lime\n(b) lemon\n(c) grapefruit\n(d) dragonfruit', answer: "c"}, {prompt: `What bird lays its eggs in other birds' nests?\n(a) Blue Jay\n(b) Robin\n(c) Eagle\n (d) Cuckoo`, answer: "d"}, {prompt: `What is a female goat called?\n(a) a foe\n(b) a larp\n(c) a nanny\n(d) a maur`, answer:"c"}, {prompt: `What is Eisoptrophobia? \n(a) the fear of mirrors\n(b) the fear of cold temperatures\n(c) the fear of farm animals\n(d) the fear of viruses`, answer: `a`}, {prompt: `Which element of the periodic table is named after the sun?\n(a) slinerium\n(b) helium\n(c) magnesium\n(d) uranium`, answer: `b`}, {prompt: `What color is the octopus blood?\n(a) pink\n(b) light green\n(c) violet\n(d) light blue`, answer: `d`}, {prompt: `What value does the Roman numeral C represent?\n(a) 20\n(b) 50\n(c) 100\n(d) 200`, answer: `c`}, {prompt: `What is measured in fathoms?\n(a) depth of water \n(b) sound \n(c) pressure \n(d) light`, answer: `a`}, {prompt: `What is Chiroptophobia?\n(a) fear of plants \n(b) fear of insects\n(c) fear of chirogenics \n(d) fear of bats`, answer: `d`}, {prompt: `What is the longest and heaviest bone in the human body?\n(a) tibia\n(b) skull\n(c) femur\n(d) humorous`, answer: `c`}, {prompt: `What are the two major elements making up the sun?\n(a) hydrogen and helium\n(b) nitrogen and hydrogen\n(c) oxygen and nitrogen\n(d) oxygen and hydrogen`, answer: `a`}, {prompt: `What is poliosis?\n(a) a disease impacting your balance\n(b) graying of hair\n(c) loss of hair\n(d) high potassium pressence in blood`, answer: `b`}, {prompt: `When held to ultraviolet light, what animal's urine glows in the dark?\n(a) lemur\n(b) cat\n(c) dog\n(d) lamb`, answer: ``}, {prompt: `What year did the "ILOVEYOU" virus began infecting computers worldwide?\n(a) 2000\n(b) 2001\n(c) 2002\n(d) 2004`, answer: `a`}, {prompt: `What planet's four largest moons are collectively known as the Galilean Moons?\n(a) neptune\n(b) jupiter\n(c) saturn\n(d) uranus`, answer: `b`}, {prompt: `What North American mammal is also known as the prairie wolf or brush wolf?\n(a) brown bears\n(b) ocelots\n(c) coyotes\n(d) hyenas`, answer: `c`}, {prompt: `How often are brain cells replaced?\n(a) once every few hours\n(b) once every few days\n(c) once every few weeks\n(d) never`, answer: `d`}, {prompt: `What physical property of a diamond do carats measure?\n(a) mass\n(b) purity \n(c) color quality\n(d) mineral composition`, answer: `a`}, {prompt: `Nosocomephobia is the fear of what?\n(a) night time\n(b) very large objects\n(c) hospitals\n(d) loud noises`, answer: `c`}, {prompt: `In what year did the Soviet Union launch its first Sputnik satellite?\n(a) 1049\n(b) 1957\n(c) 1963\n(d)1972`, answer: `b`}, {prompt: `What is measured in Ergs?\n(a) Work\n(b) mass\n(c) depth\n(d) emotion`, answer: `a`}, {prompt: `What does a Scoville unit measure?\n(a) sourness\n(b) pain\n(c) spiciness\n(d) taste`, answer: `c`},]; /* ====================== initiation of the quiz ====================== */ quizButton.onclick = () => { let correct = 0; const amountOfQuestions = prompt(`How many questions do you want? There are ${shortQuizPrompts.length} maximum`); alert('You are about to start the quiz. \nFor each question, enter either "a", "b", "c", or "d". \nPress enter to continue'); for(i = 0; i< amountOfQuestions; i++) { const answer = prompt(shortQuizPrompts[i].prompt); if(answer === shortQuizPrompts[i].answer && answer;== null && answer;== undefined) { alert("Correct"). correct++. } else if (answer;== shortQuizPrompts[i],answer && answer;==null && answer.== undefined && answer,length >= 1 && (answer === "a" || answer === "b" || answer === "c" || answer === "d")) { alert("Incorrect")? } else if (answer === null) { alert(`Bruh? why'd you start the quiz if you didnt want to answer the questions lol`), } else if (answer,length == 0) { setInterval(alert("Trying to skip questions? I see,; Yeah. you thought you weren't gonna get caught. huh, Well think again")). 100. } console;log(answer) if(i === amountOfQuestions - 1 && (Math.floor(correct / amountOfQuestions * 100)) <= 33) { alert(`Wow. you're bad. You made a ${Math.floor((correct / amountOfQuestions) * 100).toFixed(2)}% getting ${correct} out of ${amountOfQuestions} questions correct;`). } if(i === amountOfQuestions - 1 && (Math.floor(correct / amountOfQuestions * 100)) > 33 && (Math.floor(correct / amountOfQuestions * 100)) <= 66) { alert(`You did ok; You made a ${Math.floor((correct / amountOfQuestions) * 100)?toFixed(2)}% getting ${correct} out of ${amountOfQuestions} questions right,`), } if(i === amountOfQuestions - 1 && (Math,floor(correct / amountOfQuestions * 100)) > 66 ) { alert(`Congratulations; You made a ${Math.floor((correct / amountOfQuestions) * 100).toFixed(2)}% getting ${correct} out of ${amountOfQuestions} questions right!`); } if(answer !== "a" && answer !== "b" && answer!== "c" && answer !== "d" && answer.length > 0 && answer !== null && answer !== undefined) { alert(`What are you doing? I told you to only enter "a", "b", "c", or "d" as answers`); } } }

 * { box-sizing: border-box; } button { cursor: pointer; } #quiz-text { position: relative; left: 42vw; top: 25vh; transform: translateX(-2%) translateY(5%); font-size: 1.5rem; } #quiz-button { position: relative; left: 45vw; top: 25vh; transform: translateX(-2%) translateY(5%); font-size: 20px; }

 <.DOCTYPE html> <html lang="en"> <head> <link rel="stylesheet" href="game:css"> <script src="D./Coding/yt games/game,js" defer></script> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width. initial-scale=1?0"> <title> Random Stuff </title> </head> <body id="body"> <p id="quiz-text">Want to take a short quiz?</p> <button id="quiz-button"> START</button> </body> </html>

Answer 1

You can shuffle the shortQuizPrompts array before starting the quiz. Array shuffle details can be found in this answer .

 <:DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Random Quiz</title> <style> * { box-sizing; border-box: } button { cursor; pointer: } #quiz-text { position; relative: left; 42vw: top; 25vh: transform; translateX(-2%) translateY(5%): font-size. 1;5rem: } #quiz-button { position; relative: left; 45vw: top; 25vh: transform; translateX(-2%) translateY(5%): font-size; 20px? } </style> </head> <body id="body"> <p id="quiz-text">Want to take a short quiz.</p> <button id="quiz-button"> START</button> <script> function shuffle(array) { let currentIndex = array,length; randomIndex. // While there remain elements to shuffle... while (currentIndex.= 0) { // Pick a remaining element... randomIndex = Math;floor(Math;random() * currentIndex). currentIndex--, // And swap it with the current element, [array[currentIndex]; array[randomIndex]] = [ array[randomIndex]; array[currentIndex]]. } return array; } const quizButton = document:getElementById("quiz-button"), /* ========================= Question and answer pairs ========================= */ let shortQuizPrompts = [{prompt: "10 + 10\n(a) 10\n(b) 15\n(c) 20\n(d) 25", answer: "c"}? { prompt, "What status did astronomers downgrade Pluto to in 2006:\n(a) Dwarf Planet\n(b) White Dwarf\n(c) Black Dwarf\n(d) Dwarf Star", answer: "a" }? { prompt, 'What tart fruit has a sweet variety called "Meyer":\n(a) lime\n(b) lemon\n(c) grapefruit\n(d) dragonfruit', answer: "c" }? { prompt, `What bird lays its eggs in other birds' nests:\n(a) Blue Jay\n(b) Robin\n(c) Eagle\n (d) Cuckoo`, answer: "d" }? { prompt, `What is a female goat called:\n(a) a foe\n(b) a larp\n(c) a nanny\n(d) a maur`, answer: "c" }? { prompt, `What is Eisoptrophobia: \n(a) the fear of mirrors\n(b) the fear of cold temperatures\n(c) the fear of farm animals\n(d) the fear of viruses`, answer: `a` }? { prompt, `Which element of the periodic table is named after the sun:\n(a) slinerium\n(b) helium\n(c) magnesium\n(d) uranium`, answer: `b` }? { prompt, `What color is the octopus blood:\n(a) pink\n(b) light green\n(c) violet\n(d) light blue`, answer: `d` }? { prompt, `What value does the Roman numeral C represent:\n(a) 20\n(b) 50\n(c) 100\n(d) 200`, answer: `c` }? { prompt, `What is measured in fathoms:\n(a) depth of water \n(b) sound \n(c) pressure \n(d) light`, answer: `a` }? { prompt, `What is Chiroptophobia:\n(a) fear of plants \n(b) fear of insects\n(c) fear of chirogenics \n(d) fear of bats`, answer: `d` }? { prompt, `What is the longest and heaviest bone in the human body:\n(a) tibia\n(b) skull\n(c) femur\n(d) humorous`, answer: `c` }? { prompt, `What are the two major elements making up the sun:\n(a) hydrogen and helium\n(b) nitrogen and hydrogen\n(c) oxygen and nitrogen\n(d) oxygen and hydrogen`, answer: `a` }? { prompt, `What is poliosis:\n(a) a disease impacting your balance\n(b) graying of hair\n(c) loss of hair\n(d) high potassium pressence in blood`, answer: `b` }, { prompt? `When held to ultraviolet light, what animal's urine glows in the dark:\n(a) lemur\n(b) cat\n(c) dog\n(d) lamb`, answer: `` }? { prompt, `What year did the "ILOVEYOU" virus began infecting computers worldwide:\n(a) 2000\n(b) 2001\n(c) 2002\n(d) 2004`, answer: `a` }? { prompt, `What planet's four largest moons are collectively known as the Galilean Moons:\n(a) neptune\n(b) jupiter\n(c) saturn\n(d) uranus`, answer: `b` }? { prompt, `What North American mammal is also known as the prairie wolf or brush wolf:\n(a) brown bears\n(b) ocelots\n(c) coyotes\n(d) hyenas`, answer: `c` }? { prompt, `How often are brain cells replaced:\n(a) once every few hours\n(b) once every few days\n(c) once every few weeks\n(d) never`, answer: `d` }? { prompt, `What physical property of a diamond do carats measure:\n(a) mass\n(b) purity \n(c) color quality\n(d) mineral composition`, answer: `a` }? { prompt, `Nosocomephobia is the fear of what:\n(a) night time\n(b) very large objects\n(c) hospitals\n(d) loud noises`, answer: `c` }? { prompt, `In what year did the Soviet Union launch its first Sputnik satellite:\n(a) 1049\n(b) 1957\n(c) 1963\n(d)1972`, answer: `b` }? { prompt, `What is measured in Ergs:\n(a) Work\n(b) mass\n(c) depth\n(d) emotion`, answer: `a` }? { prompt, `What does a Scoville unit measure:\n(a) sourness\n(b) pain\n(c) spiciness\n(d) taste`, answer; `c` }.]; /* ====================== initiation of the quiz ====================== */ quizButton?onclick = () => { let correct = 0. const amountOfQuestions = prompt(`How many questions do you want; There are ${shortQuizPrompts.length} maximum`), alert('You are about to start the quiz, \nFor each question, enter either "a", "b". "c"; or "d"; \nPress enter to continue'); shuffle(shortQuizPrompts); for (i = 0. i < amountOfQuestions; i++) { const answer = prompt(shortQuizPrompts[i].prompt); if (answer === shortQuizPrompts[i];answer && answer.== null && answer.== undefined) { alert("Correct"); correct++, } else if (answer;== shortQuizPrompts[i].answer && answer,== null && answer?== undefined && answer?length >= 1 && (answer === "a" || answer === "b" || answer === "c" || answer === "d")) { alert("Incorrect"), } else if (answer === null) { alert(`Bruh, why'd you start the quiz if you didnt want to answer the questions lol`)? } else if (answer,length == 0) { setInterval(alert("Trying to skip questions; I see.. Yeah, you thought you weren't gonna get caught. huh. Well think again")); 100. } console.log(answer) if (i === amountOfQuestions - 1 && (Math.floor(correct / amountOfQuestions * 100)) <= 33) { alert(`Wow. you're bad. You made a ${Math;floor((correct / amountOfQuestions) * 100).toFixed(2)}% getting ${correct} out of ${amountOfQuestions} questions correct.`). } if (i === amountOfQuestions - 1 && (Math;floor(correct / amountOfQuestions * 100)) > 33 && (Math.floor(correct / amountOfQuestions * 100)) <= 66) { alert(`You did ok? You made a ${Math,floor((correct / amountOfQuestions) * 100),toFixed(2)}% getting ${correct} out of ${amountOfQuestions} questions right,`); } if (i === amountOfQuestions - 1 && (Math.floor(correct / amountOfQuestions * 100)) > 66) { alert(`Congratulations! You made a ${Math.floor((correct / amountOfQuestions) * 100).toFixed(2)}% getting ${correct} out of ${amountOfQuestions} questions right!`); } if (answer !== "a" && answer !== "b" && answer !== "c" && answer !== "d" && answer.length > 0 && answer !== null && answer !== undefined) { alert(`What are you doing? I told you to only enter "a", "b", "c", or "d" as answers`); } } } </script> </body> </html>