javascript for loop, nested if incremental value not matching?

Question

I have here a bit of code that is utilizing a javascript onclick event which calls the 'inArray' function and passes a User-input value. I am trying to iterate through the array and match the 'value' entered to one of the values in the array. I'm not trying to return a 'true/false' but if condition array[i] equals the value passed into it, then I want to execute the 'getElement' and place the corresponding text.

        function inArray(aValue) {
            var value = parseInt(aValue);
            var array = [1,2,3,4,5,6,7];
            for (i = 0; i < array.length; i++){
                if (array[i] === value) {
                    document.getElementById('primeOutput').innerHTML =
                            "yes, that's a prime below 200";
                }
              }
            document.getElementById('primeOutput').innerHTML =
                            "not a prime number below 200";
        }

I have printed to the screen the return types and both value and array are in face numbers, and when printed, they equal the same number, so why does this keep printing the last output? (not a prime number below 200) note: when I flip the condition in the if statement to '!==' , it will print the first statement to the html element id'ed as 'primeOutput'.

also, as You probably noticed, I'm simply trying to compare the User input to the list of prime numbers below 200. while there are many ways to do this, I'm really trying to find out why this code will not print the first statement when I know that the value is in the array and both data types are numbers ?

thanks again for any detailed explanations.

Answer 1

Medet's answer is correct but doesn't tell you why your code doesn't work. You are continuing with the loop once you've found a matching element, and the last line in the function will be called no matter what. There is no way of preventing it beyond throwing an error or returning early.

You can use a found variable to fix this:

function inArray(aValue) {
  var value = parseInt(aValue),
    array = [1, 2, 3, 4, 5, 6, 7],
    found = false;

  for (i = 0; i < array.length; i++) {
    if (array[i] === value) {
      found = true;
      break;
    }
  }

  if (found) {
    document.getElementById("primeOutput").innerHTML =
      "yes, that's a prime below 200";
  } else {
    document.getElementById("primeOutput").innerHTML =
      "not a prime number below 200";
  }
}

---

There is an even simpler way, however:

function inArray(aValue) {
  var value = parseInt(value),
    array = [1, 2, 3, 4, 5, 6, 7];

  return array.indexOf(value) !== -1
}

Then you can use this true/false value to render the output elsewhere:

function renderPrimeCheck(aValue) {
  if (inArray(aValue)) {
    document.getElementById("primeOutput").innerHTML =
      "yes, that's a prime below 200";
  } else {
    document.getElementById("primeOutput").innerHTML =
      "not a prime number below 200";
  }
}

Answer 2

// credit: https://stackoverflow.com/a/40200710/2308005
function isPrime(num) {
  for(var i = 2; i < num; i++)
    if(num % i === 0) return false;
  return num !== 1;
}
function inArray(aValue) {
    var value = parseInt(aValue);
    if (value < 200) {
        if (isPrime(value)) {
             document.getElementById('primeOutput').innerHTML = "yes, that's a prime below 200";
        } else {
             document.getElementById('primeOutput').innerHTML = "not a prime number below 200";
        }
    }