Я играю в палача и хочу, чтобы счетчик жизней работал

#javascript #logic

Вопрос:

     // create an array of words
const words = ['javascript','cascading', 'language','coding','amazing','tree','letter'];

let word = words[Math.floor(Math.random() * words.length)];// pick a ranndom word from the words array
let wordContainer = document.getElementById("words-container");
let answerLetters = word.split('');
console.log('answerLetters: ',answerLetters);
let lettersInput = document.querySelectorAll(".letters button");// variable which represents all buttons

let pressedLetters = [];
let correctLetters = [];
let wrongLetters = [];
let lives = 10; 
let showLives = document.querySelector('.lives');
let messageWinner = "Congrats! You won!"; 
let messageLoser = "You lost! Please try again!"

// created a span for each char in the random word
for(let i = 0; i < word.length;i  ){
    let letter = document.createElement('span');
    letter.innerText = '_ ';
    wordContainer.appendChild(letter);
}



let wordContainnerSpans = document.querySelectorAll('.words-container span');

// handle user input with event listener 
for(let i = 0; i < lettersInput.length; i  ){
    lettersInput[i].addEventListener("click", function(){
        console.log('button pressed is: ',lettersInput[i].innerHTML);
        pressedLetters.push(lettersInput[i].innerHTML);
        checkMatchAndUpdate(lettersInput[i].innerHTML);
    })
}
function checkMatchAndUpdate(guessedLetter){
    let guess = answerLetters.indexOf(guessedLetter);
    while (guess != -1) {
    correctLetters.push(guess);
    guess = answerLetters.indexOf(guessedLetter, guess   1);
    }
    console.log(correctLetters);

    for(let i = 0; i < correctLetters.length;i  ){
        wordContainnerSpans[correctLetters[i]].innerText = guessedLetter;
    }
    correctLetters = [];
}
 

У меня есть функция checkMatchAndUpdate, которая работает, но у меня возникли проблемы с созданием счетчика жизней, который я хочу, чтобы у игрока было 10 жизней, а затем отображался, если игрок проиграл или выиграл.
Если кто-то может помочь, это было бы здорово. Спасибо!

Ответ №1:

Жизни-это обычная переменная, вам нужно создать какую-то функцию для установки/проверки/добавления/удаления жизней.

В вашем коде я не вижу кода для проверки или редактирования жизней, что вы пробовали?

Простой пример:

 let isAlive = {
  lives: 0,
  isStillAlive: true,
  setLives(n){
    if(n amp;amp; !Number.isNaN(n)){
      this.lives = n
    }
    return this
  },
  check(){
    if (!this.lives || this.lives <= 0) {
      this.isStillAlive = false;
    }
    return this.isStillAlive
  },
  addLives(n){
    this.check()
    if(n amp;amp; !Number.isNaN(n)){
      this.lives = this.lives   n;
    }else{
      this.lives  ;
    }
    return this
  },
  removeLives(n){
    this.check()
    if (!this.isStillAlive) return this;
    if (n amp;amp; !Number.isNaN(n)) {
      if (this.lives - n <= 0) {
        this.lives = 0;
        this.isStillAlive = false;
      } else {
        this.lives = this.lives - n;
      }
    } else {
      if (this.lives - 1 <= 0) {
        this.lives = 0;
      } else {
        this.lives--;
      }
    }
    return this;
  },
  getLives(){
  console.log('lives ', this.lives)
    return this;
  }
}

// First set lives 
isAlive.setLives(10)

// You can get aviable lives with 
isAlive.getLives()

// you can add or remove lives
isAlive.addLives() // add 1 live
isAlive.addLives(5) // add 5 lives, total 16

isAlive.removeLives() // remove 1 live
isAlive.removeLives(2) // remove 2 lives

// Fluent interface
console.log('fluent')
isAlive.setLives(15).getLives().removeLives(2).getLives().addLives(5).getLives() // 18 lives

console.log('is still have lives? ', isAlive.check())

// STOP
isAlive.removeLives(18)

console.log('is still have lives? ', isAlive.check()) 

После этого вы можете проверить

 isAlive.check() 
 

если это правда — все еще жив, если ложь — сделайте что-нибудь вроде шоу «игра окончена».