JavaScript猜词游戏问题：按下字母键后，同一字母不会多次填充

Question

我具有猜字游戏的设置，以便当用户按下正确的字母时，相应的下划线将替换为字母。但是，我似乎无法多次获得同一封信。例如：单词“ Pennywise”有两个字母“ n”，但是无论我按几次该字母，只要按一个字母“ n”都将填充。

// Global Variables
// ================================================================================================================================================
// Create an array of words
var word = [
"michael myers", 
"freddy krueger", 
"jason voorhees", 
"xenomorph", 
"pinhead", 
"ghostface", 
"hannibal lector", 
"pennywise", 
"leatherface", 
"chucky", 
"jack torrance"
]

var rightLetter = [];
var wrongLetter = [];
var underScore = [];

// Choose word randomly
    var randNum = Math.floor(Math.random() * word.length);
    var randWord = word[randNum];
    console.log(randWord);

// DOM manipulation
var docUnderScore = document.getElementsByClassName("underscore");
var docRightGuess = document.getElementsByClassName("rightGuess");
var docWrongGuess = document.getElementsByClassName("wrongGuess");


// ================================================================================================================================================
// Main
// ================================================================================================================================================
// Create underscore based on length of word
    var generateUnderscore = () => {
        for ( var i = 0; i < randWord.length; i++) {
            underScore.push("_");
        }
        return underScore;
    }

// Get user guess
    document.addEventListener("keypress", (event) => {
        var keyWord = String.fromCharCode(event.keyCode);
        // if user's guess is correct    
        if (randWord.indexOf(keyWord) === -1) {
        // replace underscore with correct letter
            underScore[randWord.indexOf(keyWord)] = keyWord;
            docUnderScore[0].innerHTML = underScore.join(" ");

        // check to see if user word matches guess
            if (underScore.join("") === randWord) {
                alert("You Survived!");
            }
        }
        // if user's guess is incorrect     
        else {
            wrongLetter.push(keyWord);
            docWrongGuess[0].innerHTML = wrongLetter;
        }

    });

    docUnderScore[0].innerHTML = generateUnderscore().join(" ");

Answer 1

[问题是，每次获取要查找的字母的第一次出现时，您都不会使用randWord.indexOf(keyWord)继续进行操作，而是可以在每次触发keydown事件时维护一个计数器并匹配字母，如果匹配，则将其递增以继续：

// Create an array of words
var word = [
  "michael myers",
  "freddy krueger",
  "jason voorhees",
  "xenomorph",
  "pinhead",
  "ghostface",
  "hannibal lector",
  "pennywise",
  "leatherface",
  "chucky",
  "jack torrance"
];

var rightLetter = [];
var wrongLetter = [];
var underScore = [];
var counter = 0;

// Choose word randomly
var randNum = Math.floor(Math.random() * word.length);
var randWord = word[7];
console.log(randWord);

// DOM manipulation
var docUnderScore = document.getElementsByClassName("underscore");
var docRightGuess = document.getElementsByClassName("rightGuess");
var docWrongGuess = document.getElementsByClassName("wrongGuess");

// Create underscore based on length of word
var generateUnderscore = () => {
  for (var i = 0; i < randWord.length; i++) {
    underScore.push("_");
  }
  return underScore;
}

// Get user guess
document.addEventListener("keypress", (event) => {
  var keyWord = String.fromCharCode(event.keyCode);
  // if user's guess is correct    
  if (randWord[counter] == keyWord) {
    // replace underscore with correct letter
    underScore[counter] = keyWord;
    docUnderScore[0].innerHTML = underScore.join(" ");

    // check to see if user word matches guess
    if (underScore.join("") === randWord) {
      console.log("You Survived!");
    }
    counter++;
  }
  // if user's guess is incorrect     
  else {
    wrongLetter.push(keyWord);
    docWrongGuess[0].innerHTML = wrongLetter;
  }
});

docUnderScore[0].innerHTML = generateUnderscore().join(" ");

<div class="underscore"></div>
<div class="rightGuess"></div>
<div class="wrongGuess"></div>