Comparing a variable type number with an array using indexOf in Javascript

Question

I have added a click event listener to a button. It calls the buttons YES AND NO. Basically the indexOf checks if the value in the variable foto is in the yesMeetup array or in the notMeetup array.

I tried to debug but I always get "You got it" and it's not calling the debugger when I click on NO button

let foto = Math.floor(Math.random() * 20) + 1;

document.querySelector('.btn').addEventListener('click', verify);

function verify() {
   var yesMeetup = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 12, 13, 14, 15];
   var notMeetup = [16, 17, 18, 19, 20];
   var notButton = document.getElementById('no');
   var yesButton = document.getElementById('yes');
   var decisao = document.getElementById('decisao');
   debugger;

   if (yesButton) {

        if (yesMeetup.indexOf(foto)) {
         decisao.textContent = "You got it";
      } else if (notMeetup.indexOf(foto)) {
         decisao.textContent = "wrong";
      }

   } else if (notButton) {

      if (notMeetup.indexOf(foto)) {
         decisao.textContent = "You Gou it";
      } else if (yesMeetup.indexOf(foto)) {
         decisao.textContent = "Wrong";
      }

   }
}

You are generating the random number outside the click function. In this case, the number is set in stone at runtime and will never be updated again. If you want a new random number to be generated each time a click event is fired, you need to do the assignment of the foto variable inside the verify() method. Moreover, both yesButton and noButton will return true, assuming the elements exists. What you want is to check the event target to determine which button is clicked. Like e.target.id === 'yes'. — Terry
– Terry, Commented Feb 23, 2019 at 19:59
yesButton returns an element. It will always be a truthy value if it exists on the DOM. It should probably be yesButton.value — adiga
– adiga, Commented Feb 23, 2019 at 19:59
actually this variable foto needs to get into this function gerar() but as if I put inside it will be just on the scope of this function Idecided to put outside function gerar(){ var score = document.getElementById('score'); var fotoDOM = document.querySelector('.foto'); fotoDOM.src = 'foto-' + foto + '.jpg'; console.log(foto); document.getElementById('photo').style.animation ="appearPerson 1s"; score.innerHTML = foto; foto; } — Bruno Silva
– Bruno Silva, Commented Feb 23, 2019 at 21:22
but I have to get this foto variable and compare with the array inside verify(), How can but this foto variable needs to stay inside the function verify. How can I get this variable foto inside the function verify without change the number that is generating inside gerar() ?? — Bruno Silva
– Bruno Silva, Commented Feb 23, 2019 at 21:25

nem035 · Accepted Answer · 2019-02-23 20:07:19Z

4

An if statement will evaluate anything passed into it as a boolean.

The only values for which it will not execute the "true" branch are all falsy values: 0, null, undefined, '', false, NaN.

Array.prototype.indexOf returns -1 when an element is not present in an array, which is not one of the falsy values and thus your if condition

if (array.indexOf(element))

will always evaluate as true.

var example = [1,2,3];
if (example.indexOf(4)) {
  console.log('still true');
}

You can use a direct comparison to -1:

var example = [1,2,3];
if (example.indexOf(4) !== -1) {
  console.log('this is not logged');
}

Or a newer, a bit cleaner, Array.prototype.includes:

var example = [1,2,3];
if (example.includes(4)) {
  console.log('this is not logged');
}

edited Feb 23, 2019 at 20:07

answered Feb 23, 2019 at 20:01

nem035

35.5k6 gold badges93 silver badges104 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Mohit Kumar · Accepted Answer · 2019-02-23 20:58:30Z

0

You can add click events to the buttons and check the values of the random variable. As the way you have written the code, it will always return the values for both the scenarios. Alternatively, to check the values at run time, you can use alert().

answered Feb 23, 2019 at 20:58

Mohit Kumar

112 bronze badges

Collectives™ on Stack Overflow

Comparing a variable type number with an array using indexOf in Javascript

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related