Check if letter is in Array Hangman game

Tell us what’s happening:
I am writing a Hangman game. I’m stuck at the part where I check if the letter that the user guessed is in the wordArray. I got a textbox where the user can enter its guess and click a button to call a function which will get the letter from the textbox using the getElementById.value and store it in a global variable. After this I wrote another function which gets a letter guess and check if that letter matches any of the positions in the wordArray. If it does it should log the letter to the console, but it doesnt. This is where I am stuck. Please tell me what I am doing wrong! :slight_smile:

My code:

var wordArr = [];
var stripes = [];
var guessedArr = [];

/*gets the word from the textbox and stores it in a global variable*/
function getWord(){
	stripes = [];
	var word = document.getElementById("word").value;	
	var word = word.toUpperCase();
	var wordArr = Array.from(word);
	
	
	/*pushes stripes in a new array and displays it on screen. It also resets the textbox in which you can enter your secret word.*/
	for (let i = 0; i < wordArr.length; i++){
		stripes.push("-");
		}
	var guessword = stripes.join(" ");	
	document.getElementById("guessword").innerHTML = guessword;
	document.getElementById("test").innerHTML = wordArr;
	document.getElementById("word").value = "";	
}
	/*Gets the letter from the textbox and stores it in a global variable 'letter'.
	The letter gets converted to an uppercase letter and is then pushed into an array which holds guessed letters.
	It then calls the setLetter function. After this it resets the input textbox.*/
	function getLetter() {
		var letter = document.getElementById("inputletter").value;
		letter = letter.toUpperCase();
		guessedArr.push(letter)
		setLetter();
		document.getElementById("inputletter").value = "";
	}
	
	/*a for loop which runs for the length of the secret word and checks if the guessed letter matches any of the letters in the wordArray. 
	If it does it should log the letter to the console, but it doesn't. This is where I'm stuck.*/
	function setLetter(){
		for (let i = 0; i < wordArr.length; i++){
			if (word[i] === letter){
				console.log(letter);
				
			}
		}
	}

Hi @Jelmund,

Not sure it can help at all (I have very basic knowledge of JS) but I notice you sometimes use “woord” (instead of “word” ?)

Here :

function getWoord()

but also in the function where you have an issue :

if (woord[i] === letter){

Ah yeah, that is because I did a quick translation from Dutch to English before posting my code. Thanks for pointing it out, I did fix my post. The problem must be caused somewhere else tho.

Where is geraden defined? Are you getting any error messages?

Is that letter?

The variable letter is locally scoped to the getLetter function. You can pass it to setLetter. You also have access to it in the guessedArr array, but I would just pass it.

function getLetter() {
  var letter = document.getElementById('inputletter').value;
  letter = letter.toUpperCase();
  guessedArr.push(letter);
  setLetter(letter);
  document.getElementById('inputletter').value = '';
}
function setLetter(letter) {
  for (let i = 0; i < wordArr.length; i++) {
    if (word[i] === letter) {
      console.log(letter);
      return geraden;
    }
  }
}

If you have the project live somewhere like Codepen it is easier to help.

I passed letter to the setLetter function but it still does not work. new code:

var wordArr = [];
var stripes = [];
var guessedArr = [];

/*gets the word from the textbox and stores it in a global variable*/
function getWord(){
	stripes = [];
	var word = document.getElementById("word").value;	
	var word = word.toUpperCase();
	var wordArr = Array.from(word);
	
	
	/*pushes stripes in a new array and displays it on screen. It also resets the textbox in which you can enter your secret word.*/
	for (let i = 0; i < wordArr.length; i++){
		stripes.push("-");
		}
	var guessword = stripes.join(" ");	
	document.getElementById("guessword").innerHTML = guessword;
	document.getElementById("test").innerHTML = wordArr;
	document.getElementById("word").value = "";	
}
	/*Gets the letter from the textbox and stores it in a global variable 'letter'.
	The letter gets converted to an uppercase letter and is then pushed into an array which holds guessed letters.
	It then calls the setLetter function. After this it resets the input textbox.*/
	function getLetter() {
		var letter = document.getElementById("inputletter").value;
		letter = letter.toUpperCase();
		guessedArr.push(letter)
		setLetter(letter);
		document.getElementById("inputletter").value = "";
	}
	
	/*a for loop which runs for the length of the secret word and checks if the guessed letter matches any of the letters in the wordArray. 
	If it does it should log the letter to the console, but it doesn't. This is where I'm stuck.*/
	function setLetter(letter){
		console.log(letter)
		for (let i = 0; i < wordArr.length; i++){
			if (word[i] === letter){
				console.log(letter);
				
			}
		}
	}

Also, I uploaded the code to a Codepen. Link: https://codepen.io/Jelmund/pen/bPoGJp

Thanks for helping out!

I think something here might be causing a problem.

var word = word.toUpperCase();
var wordArr = Array.from(word);

Your getLetter is working properly. Inside getLetter you call setLetter and pass letter as an argument to it. The problem is, inside the for loop of setLetter you are referencing the word variable which is a DOM element, when instead, I think you meant to reference wordArr. Also, you have two wordArr variables declared in your code. Once is a global variable and one is local to getWord only. When you reference wordArr in setLetter, you are actually referencing the global version. One way to fix this problem is to just assign Array.from(word) to wordArr (which will affect the global version) instead of declaring a new wordArr local to the getWord function.

Once you fix that, you are going to have another issue in that you attempt to return gerdaen which is not defined anywhere in your code and will cause an error.

Thanks for your reply Randell, I will look into it as soon as I have some free time! :slight_smile: