Если вы когда-либо работали с Javascript, вы, вероятно, сталкивались с проблемой, требующей найти элемент или проверить, существует ли элемент в массиве. В этой статье я покажу вам, как проверить, существует ли элемент в массиве, и вернуть его с помощью одного метода.

Позвольте мне начать с проблемы проверки существования элемента в массиве. В Javascript метод Array.prototype.findIndex() выполняет поиск в массиве и, если совпадение найдено, возвращает его индекс/позицию, в противном случае возвращает -1. В зависимости от возвращаемых результатов проверить, включает ли массив наш целевой элемент, несложно.

На протяжении всей статьи я буду использовать группу пользователей для демонстрации операций поиска.

const users = [
     { id: 1, username: 'mjthecoder }, 
     { id: 2, username: 'Jerry' },
     { id: 3, username: 'Davis' }
]

Теперь, учитывая идентификаторы двух пользователей 3 и 4 соответственно, как вы можете проверить, существуют ли они в массиве? При использовании метода findIndex() код для решения этой задачи будет выглядеть следующим образом.

console.log(users.findIndex(user => user.id === 3)) // 2 : FOUND
console.log(users.findIndex(user => user.id === 4)) // -1 : NOT FOUND

Хотя проверку существования элемента в массиве можно очень хорошо выполнить с помощью findIndex(), в некоторых случаях вам нужны и элемент в массиве, и его позиция вхождения. Как решить эту проблему?

Что ж, в Javascript вы можете использовать комбинацию двух методов массива, find() и findIndex(), как показано во фрагменте кода ниже.

const position = users.findIndex(user => user.id === 3);
console.log(position) // 2
const user = users.find(user => user.id === 3);
console.log(user) // { id: 2, username: 'Davis' }

Это сработало довольно хорошо, однако я думаю, что это немного неэффективно, потому что нам нужно пройти через массив два раза. Первый проход предназначен для поиска индекса/позиции, а второй проход — для получения самого элемента. Можем ли мы сделать это за один проход? Да, и вот решение.

Array.prototype.findOnce = function(callback) {
      for (let i = 0; i < this.length; i++) {
          let currentItem = this[i];
          if(callback(currentItem, i, this)) {
             return [i, currentItem];
          }
       }
       return [-1, undefined];
}

Теперь, используя приведенное выше решение, вот как мы можем найти пользователя с идентификатором 3.

const [position, user] = users.findOnce(user => user.id === 3);
console.log(position); // 2
consooe.log(user); // { id : 2, username: 'Davis' };

Как и find(), метод findOnce() принимает функцию обратного вызова и возвращает массив, содержащий позицию элемента в качестве первого элемента и сам элемент в качестве второго элемента. Если элемент не найден, первый элемент возвращаемого массива будет равен -1, а второй элемент будет не определен.

Приведенное выше решение добавляет findOnce() непосредственно в массив Javascript. опытный образец. Несмотря на то, что этот способ работает довольно хорошо, не рекомендуется добавлять методы или свойства непосредственно во встроенные прототипы объектов Javascript. При этом, вот как вы можете переписать метод findOnce() и повторно использовать его в своей кодовой базе.

findOnce(arr, callback) {
     for (let i = 0; i < arr.length; i++) {
         let currentItem = arr[i];
         if (callback(currentItem, i, arr)) {
            return [i, currentItem];
         }
     }
     return [-1, undefined];
}

Заключение

В этой статье показано, как можно создать функцию, сочетающую поведение функций find() и findIndex() для выполнения эффективных операций поиска в любом массиве Javascript. Если вы нашли эту статью полезной, пожалуйста, оставьте комментарий или хлопните в ладоши.