Hangman query javascript


I would like to ask if someone finds out what the problem is in the code that I left of the game hanged.

I have a button with the id test-letter , which the idea would be to go through an array where you save the word and compare it with the val() of an input.

The problem is that something fails because it is not comparing it.


    	//name = prompt('Cual es tu nombre');

    	//var h2Name = document.getElementById('name').innerHTML = name;

    	var words = ['pala','martillo','pico','pelota','guante', 'la'];	
    	var answerWord = [];
    	var hiddenWord = [];

    	// function to pick a random word from words array
    	function pickWord() {
    		var randomNumber = Math.floor(Math.random()* words.length); 
    		var randomWord = words[randomNumber];

    		var divWord = $('.word-container');
    		var splitRandomWord = randomWord.split('');

    		for (var i = 0; i < randomWord.length; i++) {
    			var letter = answerWord[i] = '_';
    			divWord.append('<p class="letters">'+ letter + '</p>');

    	function resetArray(array) {
    		for (var i = 0; i < array.length; i++) {

    	$('#start').click(function(event) {
    	$('#test-letter').click(function(event) {

    		var letterToTest = $('.guess').find('input').val();

    		if (letterToTest.length > 1) {
    			alert('Ingrese solo una letra')
    		} else if (letterToTest === '') {
    			alert('Debe ingresar una letra')
    		} else {

    			for (var i = 0; i < hiddenWord.length; i++) {
    				if (letterToTest === hiddenWord[i]) {

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    	<div class="header">
    		<div class="border-header">
    		<h2 id="name"></h2>

    	<div class="button-container">
    		<button id="start">Comenzar</button>
    		<button id="reset">Resetear</button>
    	<div class="word-container">
    	<div class="guess">
    		<input type="text" name="">
    		<button id="test-letter">Probar</button>

    	<script type="text/javascript" src="jquery-3.2.1.min.js"></script>
    	<script type="text/javascript" src="script.js"></script>
asked by Fernando Colom 22.06.2017 в 17:29

1 answer


The problem is with the variable hiddenWord . This variable is an array of objects, and in the function pickWord what is saved is an array of the letters that make up the word chosen at random. This array is the object that is stored in hiddenWord with the length of hiddenWord is 1, which causes the loop to only repeat once.

Then you try to compare the letter entered with the first position of hiddenWord , which is the array of the letters of the chosen word and do not coincide logically. What you must do is first put the array of letters in a variable and use that variable in your comparison loop.

Try changing your loop for this:

var letterarray=hiddenWord[0]; //Obtenemos el array de letras de la palabra a buscar
for (var i = 0; i < letterarray.length; i++) {
        if (letterToTest === letterarray[i]) {

On the other hand, it's a bit strange how you use Push / Pop in that code. Actually in hiddenword the logical thing is that you will store the array of letters of the chosen word. Simply, by removing pickWord from hiddenWord.pop and modifying line hiddenWord.push(splitRandomWord); by hiddenWord = splitRandomWord; , the rest of the code would work correctly.

answered by 22.06.2017 в 17:46