JavaScript | Как получить каждый второй элемент массива?

JavaScript | Как получить каждый второй элемент массива?

Мы хотим получить из массива каждый второй элемент. Как это сделать?

У нас есть массив:

let massiv = [1,2,3,4,5,6,7,8,9,10];

Мы взяли массив из чисел для простоты восприятия.

 

Использование метода filter()

Из документации мы знаем, что метод filter() может принимать ДВА параметра. Первый обязательный — это функция обратного вызова, выполнение которой должно приводить к получению логического значения true или false. Её нам будет достаточно.

Эта функция обратного вызова может принимать ТРИ параметра:

  1. значение элемента
  2. индекс элемента
  3. просматриваемый (обходимый) объект

Для решения задачи нам будет достаточно передать первые два параметра. Если быть точнее, то нам нужен только второй параметр, но к сожалению, мы не можем передать только его одного. Индексы любого «нормального» массива начинаются с 0 (нуля) и увеличиваются на 1 для каждого элемента массива.

Это значит, что нам нужны индексы массива под номерами 1, 3, 5, 7 … и так далее.

Решить задачу нам поможет оператор остатка от деления — %, который будет возвращать нам какое-то целое число, которое в последствии будет приведено к логическому типу. Выглядеть это будет так:

let massiv = [1,2,3,4,5,6,7,8,9,10];
massiv.filter((item, index) => index % 2);
[2, 4, 6, 8, 10]
Получили каждый второй элемент массива JavaScript
Получили каждый второй элемент массива JavaScript

 

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

Давайте по шагам посмотрим на преобразования.

Сначала в коллбэк придёт индекс под номером НОЛЬ.

0 % 2

Данное выражение возвращает нам число 0. Наш коллбэк попытается привести НОЛЬ к логическому типу и мы получим false. Метод filter() посмотрит на false и не добавит элемент массива в новый массив. Элемент со значением 1 будет выброшен. Далее ситуация будет чередоваться:

Чередование 0 и 1 в остатке от деления для целочисленных индексов массива JavaScript
Чередование 0 и 1 в остатке от деления для целочисленных индексов массива JavaScript

Не трудно догадаться, что подобное чередование остатков от деления всегда будет преобразовываться в чередование true и false. Элемент под индексом 1 будет ВТОРЫМ элементом массива. Индекс 1 вернёт нам остаток от деления в виде числа 1, которое будет преобразовано в true и в результате мы получим второй элемент массива в новый массив. Ситуация будет повторяться до самого конца массива и в итоге мы получим новый массив, который будет состоять только из вторых элементов оригинального массива.

 

Альтернативное универсальное решение

Если нам нужно будет написать функцию, в которую мы будем передавать нужный нам шаг получения элементов массива, то тогда выражение примет немного иной вид.

Вместе с остатком от деления мы будем использовать отрицание и группировку. Выглядеть это будет так:

let massiv = [1,2,3,4,5,6,7,8,9,10];
massiv.filter((item, index)=>!((index+1)%2));

Использовали отрицание и группировку для получения каждого второго элемента массива JavaScript
Использовали отрицание и группировку для получения каждого второго элемента массива JavaScript

 

Функция получения каждых N-ых элементов массива

function everyN (array, n){

   return array.filter((item, index)=>!((index+1)%n));

}

Пример работы функции:

Универсальная функция получения каждого N-ого элемента массива JavaScript
Универсальная функция получения каждого N-ого элемента массива JavaScript

 

Информационные ссылки

JavaScript | Как получить каждый третий элемент массива?

Стандарт ECMAScript — Раздел «23.1.3.8 Array.prototype.filter ( callbackfn [ , thisArg ] )» — https://tc39.es/ecma262/multipage/indexed-collections.html#sec-array.prototype.filter

Стандарт ECMAScript — Раздел «13.7 Multiplicative Operators» — https://tc39.es/ecma262/multipage/ecmascript-language-expressions.html#sec-multiplicative-operators