如何在JavaScript文字游戲中遍歷一系列答案和提示？

Question

我正在從事文字游戲項目。 我的問題是我讓游戲發布單詞而不是提示（我將它們鏈接到按鈕），並且當我按下按鈕時，它將執行所有提示，並且每個單詞只需要一個提示。 每個單詞都具有彼此相同順序的提示（即，提示0與數組中的單詞0匹配）。 沒有CSS，因為目前我專注於樣式方面的功能。 我也很不擅長解釋事情，而且我願意澄清任何我可能未提及的事情。 該代碼在下面列出。

HTML

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <link rel="stylesheet" href="stylesheets/main.css">
</head>

<body>
<div class="wrapper">
    <h1>Degrassi Next Class</h1>
    <h2>Word Game</h2>
    <h3> Click on with your mouse or enter a letter with your keyboard to start</h3>
</div>

<div id="simpson"></div>
<br>
<br>
<button id="spoiler">#spoileralert</button>
    <script src="index.js"></script>
</body>

</html>

JS

var degrassi = [
    "Maya", "Zig", "Lola", "Frankie", "Yael", "Tiny", "Zoe", "Tristan", "Grace", "Esme", "Winston", "Hunter", "Vijay", "Rasha", "Goldi", "Jonah", "Baaz", "Miles", "Saad", "Shay"
];


// select a random character
var currentCharacter = degrassi[Math.floor(Math.random() * degrassi.length)];

// the array that loops through characters
var charactersArray = [];
for (var i = 0; i < currentCharacter.length; i++) {
    charactersArray[i] = "_";
}

var lettersLeft = currentCharacter.length;


var simpson = document.getElementById("simpson");
simpson.innerHTML = charactersArray.join(" ");


// hints also knows as spoiler alert
var spoilerz = document.getElementById.spoiler.onclick = function () {
    var spoiler = [
        "Their sister visits from college due to a tragedy",
        "Only character to be in a polyamourus relationship",
        "This character had an abortion",
        "This character has a twin",
        "This character is generqueer",
        "This character was in a gang with his brother",
        "This character was on an actor on West Drive",
        "This character was in a coma after a bus crash",
        "This characters nickname is The Watcher",
        "This character pushed their significant other down a hill",
        "This characters nickname is Chewy",
        "This character caused a school lockdown",
        'First line: "Oh My God! I love high school."',
        "This character was prom queen with their significant other",
        "This character is president of the feminist club",
        "This character has a daughter",
        "This character has an older sister who graduated in 2016",
        "This characters father is abusive",
        "This characters nickname is Creepy Camera Guy",
        "This character was in a love triangle with her best friend"
    ];

    // selects a spoiler this should coorespond with the character
    var currentSpoiler = spoiler[Math.floor(Math.random() * spoiler.length)];


    // loop through spoilers
    var spoilerArray = [];
    for (var i = 0; i < currentSpoiler.length; i++) {
        spoilerArray[i] = "_";
    }

};

Answer 1

似乎您選擇的是隨機數的兩倍。 這可能不是您想要的，因為這將返回（在大多數情況下）兩個不同的數字，例如2和4。您應該定義一個新數字（假設為var index ）並假定它是一個隨機數。 由於兩個數組（ spoiler和degrassi ）的長度相同，因此可以采用degrassi的長度。

要使代碼正常工作，您應該替換
var currentCharacter = degrassi[Math.floor(Math.random() * degrassi.length)]; 與
var index = Math.floor(Math.random() * degrassi.length); var currentCharacter = degrassi[index] var index = Math.floor(Math.random() * degrassi.length); var currentCharacter = degrassi[index]和
var currentSpoiler = spoiler[Math.floor(Math.random() * spoiler.length)];
與var currentSpoiler = spoiler[index];

您還需要一些東西來輸出擾流板，但是由於我看不到要在哪里做，因此目前我無法為您提供幫助

Answer 2

就像上面Nicola回答的那樣，您需要將隨機數分配給變量，而不是兩次調用它。

我還建議您將數組構造為一個對象數組，如下所示：

 var degrassi = [
    {name: "Maya", hint:"Their sister visits from college due to a tragedy"}, //remaining names and hints ]; 

  var random = Math.floor(Math.random() * degrassi.length)

那么您可以像這樣調用您的角色名稱和提示：

degrassi[random].name  //gives you the name
degrassi[random].hint  //gives you its corresponding hint

這將使您的代碼更易於更改和維護，以及添加更多名稱和提示等。

如何在JavaScript文字游戲中遍歷一系列答案和提示？

問題描述

2 個解決方案

解決方案1
0 2018-02-26 18:06:46

解決方案2
0 2018-02-26 18:14:45

如何在JavaScript文字游戲中遍歷一系列答案和提示？

問題描述

2 個解決方案

解決方案1 0 2018-02-26 18:06:46

解決方案2 0 2018-02-26 18:14:45

解決方案1
0 2018-02-26 18:06:46

解決方案2
0 2018-02-26 18:14:45