检查JavaScript中的数组中是否存在数字输入值

时间:2017-04-16 06:18:30

标签: javascript arrays loops

我正在尝试检查数组中是否存在输入的数字。我尝试过很多东西,并且没有任何工作可做。

function start() {
    var arrNum = [18, 23, 20, 17, 21, 18, 22, 19, 18, 20];
    var input = document.getElementById('input').value;
    var numberExist = document.getElementById('numberExist').innerHTML;

    for (var i = 0; i < arrNum.length; i++) {
        if (input === arrNum[i]) {
            alert('input');
            numberExist = ('The number ' + input + 'exists in the array');
        } else {
            numberExist = ('The number ' + input + 'does not exist in the array');
        }
    }

    var arrNum = arrNum.join(' ');
    document.getElementById('listOfvalues').innerHTML = ('The values in the array are ' + arrNum);
}

9 个答案:

答案 0 :(得分:1)

以下是一些指示:

  • 您需要将input.value转换为整数,例如使用一元+运算符,因为HTMLInputElement#value属性返回一个字符串。
  • 除非你,否则你的else块将在第一次for循环迭代中运行 将它移动到循环体的

function start() {
  var arrNum = [18, 23, 20, 17, 21, 18, 22, 19, 18, 20]
  var input = +document.getElementById('input').value
  var numberExist

  for (var i = 0; i < arrNum.length; i++) {
    if (input === arrNum[i]) {
      numberExist = 'The number ' + input + ' exists in the array'
    }
  }
  if (!numberExist) {
    numberExist = 'The number ' + input + ' does not exist in the array'
  }
  document.getElementById('listOfvalues').textContent =
    'The values in the array are ' + arrNum.join(' ')
  document.getElementById('numberExist').textContent = numberExist
}

start()
<input type="number" id="input" value="18">
<div id="listOfvalues"></div>
<div id="numberExist"></div>

当然,正如其他人所指出的那样,使用Array#indexOf方法可以大大简化这个例子:

function start() {
  var array = [18, 23, 20, 17, 21, 18, 22, 19, 18, 20]
  var input = +document.getElementById('input').value
  var numberExist = array.indexOf(input) < 0
    ? 'The number ' + input + ' does not exist in the array'
    : 'The number ' + input + ' exists in the array'

  document.getElementById('listOfvalues').textContent =
    'The values in the array are ' + array.join(' ')
  document.getElementById('numberExist').textContent = numberExist
}

start()
<input type="number" id="input" value="18">
<div id="listOfvalues"></div>
<div id="numberExist"></div>

答案 1 :(得分:0)

尝试indexOf功能 例如:

arr = [1, 4, 18, 5, 10];
arr.indexOf(4); //returns 4
arr.indexOf(20); //returns -1

答案 2 :(得分:0)

使用indexOf方法

var arrNum = [18, 23, 20, 17, 21, 18, 22, 19, 18, 20];

function checkNumber(x){
 if(arrNum.indexOf(x)!=-1){
    alert('number exist')
 }
 else{
 alert('dont exist')
 }

}
checkNumber(8) // alert don't exist

答案 3 :(得分:0)

数组原型有一个method UpdateListener,它返回元素的索引(如果存在),否则返回-1。

在ES6中添加indexOf method,根据元素的存在返回true / false。

答案 4 :(得分:0)

试试这个:

&#13;
&#13;
function checkIfExists(arr, num){
  for (var i = 0; i < arr.length; i +=1){
      if(num === arr[i]){
        return true;
      }
  }
  return false;
}

var arrNum = [18, 23, 20, 17, 21, 18, 22, 19, 18, 20];
var userInput = document.getElementById('user-input');

arrNumStr = arrNum.join(",");
    document.getElementById('listOfvalues').innerHTML = ('The values in the array are ' + arrNumStr);
    
document.getElementById('check').onclick = function  () {
var input = Number(userInput.value); // Using Number to convert from string to number
    
    //if (arrNum.indexOf(input) > -1)
    if (checkIfExists(arrNum,input)){
        alert('Number is exists')
    }else{
        alert('Number not exists');
    }
  
}
&#13;
<input type="text" id="user-input">
<br>
<input type="button" id="check" value="Check">
<br>
<div id="listOfvalues" ></div>
&#13;
&#13;
&#13;

答案 5 :(得分:0)

input值转换为默认为字符串的数字。

var input = +document.getElementById('input').value;
//OR input = Number(document.getElementById('input').value);
//OR input = parseInt(document.getElementById('input').value, 10);
如果找到数字,

中断循环,不要继续运行循环。

if (input === arrNum[i]) {
        numberExist.innerHTML = ('The number ' + input + ' exists in the array');
        break;
    }

&#13;
&#13;
window.onload = start;
function start() {
    var arrNum = [18, 23, 20, 17, 21, 18, 22, 19, 18, 20];
    var input = +document.getElementById('input').value;
    var numberExist = document.getElementById('numberExist');

    for (var i = 0; i < arrNum.length; i++) {
        if (input === arrNum[i]) {
            numberExist.innerHTML = ('The number ' + input + ' exists in the array');
            break;
        } else {
            numberExist.innerHTML = ('The number ' + input + ' does not exist in the array');
        }
    }

    var arrNum = arrNum.join(' ');
    document.getElementById('listOfValues').innerHTML = ('The values in the array are ' + arrNum);
}
&#13;
<input type="number" id="input" value="18" onblur="start()"/>
<button onclick="start()">Check</button>
<div id="numberExist"></div>
<div id="listOfValues"></div>
&#13;
&#13;
&#13;

答案 6 :(得分:0)

严格等于运算符比较类型:Which equals operator (== vs ===) should be used in JavaScript comparisons?

&#13;
&#13;
console.log("1 == 1 is", 1 == 1);
console.log("1 == \"1\" is", 1 == "1");
console.log("1 === 1 is", 1 === 1);
console.log("1 === \"1\" is", 1 === "1");
console.log("1 === parseInt(\"1\", 10) is", 1 === parseInt("1", 10));
&#13;
&#13;
&#13;

答案 7 :(得分:0)

现在可以使用“includes”方法完成此操作(不适用于 Edge 13 或更早版本)。

if( arr.includes(valueToFind) ){

w3schools

答案 8 :(得分:-1)

尝试使用Number()功能。例如Number(input)。由于您输入的框类型不是Number。因此,在input变量中,您总是得到字符串。因此,您需要将字符串转换为数字。