首页 > 解决方案 > 如何选择生成多少个随机字符串?

问题描述

我正在尝试创建一个随机名称生成器。如何选择生成多少个字符串而不必复制和粘贴如此多的重复代码?有没有办法有一个输入框,我可以在其中输入一个数字,它会产生那个数量?

function generator() {

    var planets = ["mercury","venus","earth","mars","jupiter","saturn","uranus","neptune","pluto"];
    
    var planets = planets[Math.floor(Math.random() * planets.length)] + " " 
    + planets[Math.floor(Math.random() * planets.length)] + " "
    + planets[Math.floor(Math.random() * planets.length)] + " "
    + planets[Math.floor(Math.random() * planets.length)] + " "
    + planets[Math.floor(Math.random() * planets.length)] + " "
    + planets[Math.floor(Math.random() * planets.length)] + " "
    + planets[Math.floor(Math.random() * planets.length)] + " "
    + planets[Math.floor(Math.random() * planets.length)] + " "
    + planets[Math.floor(Math.random() * planets.length)] + " "
    + planets[Math.floor(Math.random() * planets.length)] + " "
    ;
    
    if (document.getElementById("planets")) {
    document.getElementById("placeholder").removeChild(document.getElementById("planets"));
    }
    
    var element = document.createElement("div");
    element.setAttribute("id", "planets");
    element.appendChild(document.createTextNode(planets));
    document.getElementById("placeholder").appendChild(element);
    }   

标签: javascript

解决方案


我将假设您不仅要选择随机名称,而且该随机选择中没有重复项。

最简单的方法是使用随机打乱数组的函数。你可以从这里“借出”一个实现。

注意:似乎没有充分的理由删除并重新创建文档中的植物元素。只是重复使用它。

这是与行星数组的简单集成以及用于指定数字的输入:

let planets = ["mercury","venus","earth","mars","jupiter","saturn","uranus","neptune","pluto"];
let button = document.querySelector("#generate");
let input = document.querySelector("#num");
let output = document.querySelector("#planets");

button.addEventListener("click", generate);

function generate() {
    // Shuffle the planets randomly
    shuffle(planets);
    // Select only the number of planets that the user wants
    let selected = planets.slice(0, +input.value);
    // output the result, space-separated
    output.textContent = selected.join(" ");
}

function shuffle(array) {
    for (var i = array.length - 1; i > 0; i--) {
        var j = Math.floor(Math.random() * (i + 1));
        var temp = array[i];
        array[i] = array[j];
        array[j] = temp;
    }
}
number of planets: <input type="number" id="num" size="3" value="4">
<button id="generate">Generate</button><br>
<div id="planets"></div>


推荐阅读