Почему find () не возвращает правильное значение? - PullRequest
Новая
       5

Почему find () не возвращает правильное значение?

2 голосов
/ 24 января 2020

Я пытаюсь, чтобы при вводе значения, отсутствующего в массиве, оно отображалось на экране. Таким образом, когда метод find не возвращает undefined, он показывает введенное значение. Но я не знаю почему, он всегда возвращает неопределенное значение.

Код: 

<html>
<body>

<p id="demo"></p>

<input type="text" id="number">

    <script>
      var number = document.getElementById("number");

      const array1 = [5, 12, 8, 98, 44];

      var found = array1.find(element => element == number.value);

      number.addEventListener("input", function(){
        if(found == undefined){
          document.getElementById("demo").innerHTML = number.value;
        }
      });
  </script>
</body>
</html>

Ответы [ 3 ]

3 голосов
/ 24 января 2020

Вам нужно взять значение фактическое из ввода в функции события, а также метод find. В противном случае вы получите начальное значение из входных данных и результат поиска, который не соответствует более поздним входным данным.

Вы можете взять Array#some вместо Array#find потому что у вас есть только числа в массиве. Если у вас есть объект и вам нужен объект, find будет работать лучше, потому что вы получите результат, отличный от простого числа.

Слово для Оператор равенства ==. Этого оператора следует избегать, потому что он меняет тип fo по сравнению с другим значением. Вместо этого используйте Оператор идентификации / строгого равенства ===, который проверяет тип и значение. 

const array1 = [5, 12, 8, 98, 44];

number.addEventListener("input", function() {
    var number = document.getElementById("number"),
        found = array1.some(element => element == number.value);

    if (found) {
        document.getElementById("demo").innerHTML = 'found';
    } else {
        document.getElementById("demo").innerHTML = 'not found: ' + number.value;
    }
});
<p id="demo"></p>
<input type="text" id="number">

Для более разумного подхода принимайте Array#includes `в качестве проверки со значением в качестве числа в качестве параметра. 

const array1 = [5, 12, 8, 98, 44];

number.addEventListener("input", function() {
    var number = document.getElementById("number").value;

    if (array1.includes(+number)) {
        document.getElementById("demo").innerHTML = 'found';
    } else {
        document.getElementById("demo").innerHTML = 'not found: ' + number;
    }
});
<p id="demo"></p>
<input type="text" id="number">
0 голосов
/ 24 января 2020 

<p id="demo"></p>

<input type="text" id="number">

<script>
    number.addEventListener("input", function () {
        var number = document.getElementById("number");
        const array1 = [5, 12, 8, 98, 44];
        var found = array1.find(element => element == number.value);
        if (found == undefined) {
            document.getElementById("demo").innerHTML = number.value;
        }
    });
</script>

0 голосов
/ 24 января 2020

метод find должен вызываться каждый раз при изменении входного значения. В противном случае он будет вызван один раз, а затем каждый раз, когда происходит событие, ничего не рассчитывается. Так что вам нужно поместить свой метод find внутри слушателя событий

...