Question

我正在开发一款游戏，每次按下错误的键时，我都需要将计数功能减1次。

到目前为止，这是我的代码：

var names = ["Adam Red", "Bob Green", "Chris Blue"];
var nameChosen = names[Math.floor(Math.random() * names.length)];
var nameSplit = nameChosen.split("");
var updated = [];
var attempt = nameChosen.length - 2;

function display(char) {
    //replace each of the letters with underscore and space with dash
    char = char || '_';   // set to default when no char given
    var nameDisplayed = [];

    for (var i = 0; i < nameSplit.length; i++) {
        if (updated[i] || (char.toLowerCase() === nameSplit[i].toLowerCase())) {
            nameDisplayed += nameSplit[i];
            updated[i] = true;
        }
        else if (nameSplit[i] == " ") {
            nameDisplayed += "- ";
        } 
        else {
            nameDisplayed += "_ ";
        }
    }
    document.getElementById("nameDisplay").innerHTML = nameDisplayed;
}

//get key pressed by user
document.addEventListener('keypress', function(evt) {
    evt = evt || window.event;
    var charCode = evt.keyCode || evt.which;
    var charStr = String.fromCharCode(charCode);

    display(charStr); // call when typing
});

display(); // call onload

我知道我需要将attempt--放在循环中的某个位置，但是当按下错误的键时，我只能减去字母的所有长度。

例如：如果所选名称为Adam Red且key z被按下，则代替attempt = attempt - 1，它会给我attempt = attempt - 7（Adam中的字母总数）红色）。

Answer 1

从您的代码看，您可以全局访问nameChosen和attempt。如果确实如此，那么您可以通过这种方式更新您的事件监听器：

document.addEventListener('keypress', function(evt) {
    evt = evt || window.event;
    var charCode = evt.keyCode || evt.which;
    var charStr = String.fromCharCode(charCode);

    if (nameChosen.includes(charStr))
        display(charStr); // call when typing
    else 
        attempts--;
});

基本上我所做的更改是使用方法String.includes()添加一个检查，以在更新UI之前验证所选名称是否包含字符串。此外，您可能希望为玩家添加一些UI反馈，以了解他的尝试次数正在下降。

希望它有所帮助。

Answer 2

给定解决方案使用包括ES6的一部分。如果你想支持旧的浏览器，这里是使用indexOf的解决方案。

var updated = new Array(nameSplit.length).join('_');
function display(char) {
    //replace each of the letters with underscore and space with dash
    char = char || '_';   // set to default when no char given
    var nameDisplayed = [];

    var indexAt = nameSplit.indexOf(char);
    if(indexAt !== -1) {
        // to avoid in next search
        nameSplit[indexAt] = null;
        updated[indexAt] = char;
    } else {
        attempt--;
    }
    document.getElementById("nameDisplay").innerHTML = nameDisplayed;
}

Answer 3

我已经编写了另一个代码部分来完成同样的工作。我尝试使用ES6之类的一些lambda functions代码。

我写的代码可以做以下事情;

按下键时检查字母是否为名称
只允许按一次所有键
显示尝试次数
说你赢了！
说你输了！如果你在尝试计数器归零之前找不到

代码如下：

＆＃13;

let names = ["Adam Red", "Bob Green", "Chris Blue"];
let nameChosen = names[Math.floor(Math.random() * names.length)];
let nameSplit = nameChosen.split("");
let attempt = nameChosen.length - 2;

const chosenName = [];
const letterTried = [];

let checkWin = () => chosenName.filter(val => val.isLetter).map(val => val.isFound).reduce((a, b) => a && b, true);
let toText = () => chosenName.map(val => val.valueFound).reduce((a, b) => a + " " + b, "");

nameSplit.forEach(function(val, i) {
  chosenName.push({
    isLetter: val.match(/[a-z]/i) ? true : false,
    isFound: false,
    value: val,
    valueFound: val == " " ? "-" : "_",
    index: i
  });
});

function check(charStr) {
  if (letterTried.includes(charStr))
    return false;

  letterTried.push(charStr);

  chosenName.filter(val => !val.isFound && val.isLetter).forEach(function(val, i) {
    if (charStr.toLowerCase() === val.value.toLowerCase()) {
      val.valueFound = val.value;
      val.isFound = true;
    }
  });

  if (!chosenName.map(val => val.value.toLowerCase()).includes(charStr.toLowerCase()))
    attempt--;
}

//get key pressed by user
document.addEventListener('keypress', function(evt) {
  evt = evt || window.event;
  var charCode = evt.keyCode || evt.which;
  var charStr = String.fromCharCode(charCode);

  check(charStr);
  document.getElementById("nameDisplay").innerHTML = toText();
  document.getElementById("attempt").innerHTML = attempt;

  if (checkWin())
    document.getElementById("attempt").innerHTML = "You Win!";

  if (attempt <= 0)
    document.getElementById("attempt").innerHTML = "You Lost!";
});

document.getElementById("nameDisplay").innerHTML = toText();
document.getElementById("attempt").innerHTML = attempt;

＆＃13;

<div id="nameDisplay"></div>
Attempts: <span id="attempt"></span>

＆＃13;

按错键时javascript减去计数？

3 个答案: