Упростите свой JavaScript - используйте .some () и .find ()

Упростите свой JavaScript - используйте .some () и .find ()

После безумного количества просмотров моей статьи о .map(), .reduce() и .filter() я подумал, что должен поделиться еще двумя методами массива, которые являются полезными инструментами в JavaScript разработчиках. арсенал: .some() и .find().

Давай нырнем!

.некоторые()

Этот метод массива помогает определить, соответствует ли одно или несколько его значений тому, что вы ищете. Если вам это непонятно, позвольте мне проиллюстрировать это примером ...

Вот список оперативников, работающих на вашу суперсекретную организацию:

var operatives = [
  { id: 12, name: 'Baze Malbus', pilot: false },
  { id: 44, name: 'Bodhi Rook', pilot: true },
  { id: 59, name: 'Chirrut Îmwe', pilot: false },
  { id: 122, name: 'Jyn Erso', pilot: false }
];

Вы хотите знать, есть ли среди ваших оперативников пилоты. Есть много способов достичь этой цели. Большинство людей, вероятно, будут использовать .forEach() и делать что-то вроде этого:

var listHasPilots = false;
operatives.forEach(function (operative) {
  if (operative.pilot) {
    listHasPilots = true;
  }
});

Это много строк, чтобы посмотреть, есть ли в списке пилот. Попробуем использовать .some()!

var listHasPilots = operatives.some(function (operative) {
  return operative.pilot;
});

Мы можем даже быть более краткими с функциями стрелок (требуется поддержка ES6, Babel или TypeScript).

const listHasPilots = operatives.some(operative => operative.pilot);

Как это работает?

Итак, вы передаете .some() функцию в качестве аргумента. Эта функция выполняется для каждого значения в массиве. Затем вы можете увидеть, соответствует ли значение записанному вами условию. Функция должна возвращать логическое значение (хотя истинное / ложное значение также работает). Как только будет возвращен один true, .some() сам вернет true. Если ни одно из значений при обработке в вашем условии не вернет true (если все они вернут false), тогда .some() вернет false.

Обратите внимание, что как только будет возвращено одно значение true, .some() прекратит проверку других значений массива. В нашем примере выше функция запускается только дважды, поскольку второй оперативник, Бодхи Рук, является пилотом. Нет необходимости проверять других пилотов.

TL; DR: если некоторые значения вашего массива соответствуют тому, что вы ищете, .some() вернет true . В противном случае будет возвращено false.

.каждый()

Как было указано в комментариях, знайте, что вы также можете проверить, соответствует ли каждое значение массива вашему условию, используя .every(). Он работает точно так же, как .some(), но вернет true только в случае совпадения всех совпадений.

.найти()

Этот метод array делает именно то, что говорит: он находит то, что вы ищете. Вкратце, .find() вернет первое значение, соответствующее переданному условию. Давайте посмотрим, как это работает с теми же данными, что и ранее.

Вот наш список оперативников:

var operatives = [
  { id: 12, name: 'Baze Malbus', pilot: false },
  { id: 44, name: 'Bodhi Rook', pilot: true },
  { id: 59, name: 'Chirrut Îmwe', pilot: false },
  { id: 122, name: 'Jyn Erso', pilot: false }
];

Все так же, как и раньше, за исключением того, что на этот раз вместо того, чтобы спрашивать себя, есть ли в наших рядах пилот, нам нужен профиль этого пилота! Давайте выведем нужное нам значение, используя .find():

var firstPilot = operatives.find(function (operative) {
  return operative.pilot;
});

Еще короче со стрелочными функциями ES6:

const firstPilot = operatives.find(operative => operative.pilot);

Как видите, код в точности такой же, как и для .some(), с той лишь разницей, что мы изменили some на find! Но теперь вместо того, чтобы возвращать логическое значение, он вернет первый пилот в нашем списке.

Подчеркну: .find() вернет первое совпадение. Если вашему условию соответствует больше значений, это не имеет значения. Будет возвращено только первое совпадение. Если вам нужен список всех совпадений, то вы должны использовать .filter() вместо .find().

Если совпадений не найдено, .find() вернет undefined.

Преимущества

Использование .find() и .some() вместо обычных циклов, таких как .for или .forEach(), не только делает ваш код короче, но и проясняет ваши намерения. Цикл можно использовать для чего угодно, но использование .find() означает, что вы ищете один конкретный элемент массива. Что касается .some(), вы явно проверяете, содержит ли массив элементы, которые соответствуют вашим потребностям.

Сделайте свой код более понятным! При необходимости используйте .find() и .some().

Вот и все!

Надеюсь, вы узнали что-то новое. Поделитесь своими знаниями с другими разработчиками!

Знаете ли вы о других жемчужинах JavaScript, которые могли бы помочь сообществу JS писать более чистый и простой код? Если да, оставьте комментарий, и я постараюсь написать об этом в блоге.

Продолжайте кодировать!