JavaScript: используем filter()

Доброго времени суток, уважаемый читатель!

Недавно меня попросили помочь решить одну простенькую задачку.

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

 

 

Условие

Дан одномерный массив из 7 элементов. Необходимо посчитать количество элементов, находящихся на нечетных позициях и имеющие нечетное значение.

Посмотрим, как можно решить такую задачу.

 

Вариант решения №1

Первое, что мне пришло на ум — создать цикл for, в котором поставить обычные проверки на нечетность. Ниже привожу пример:

var q = 0; /* кол-во элементов */
var array = [1, 9, 3, 7, 5, 0, 2];
for (var i = 0; i < array.length; i++) {
    if (i % 2) { /* если позиция нечетная (1, 3, 5...) */
        if (array[i] % 2) { /* если значение нечетно */
            q++;
        }
    }
}
alert(q); // 2 элемента, удовлетворяющих условию

Мы создаем массив, пробегаем по циклу весь массив от 0 до array.length (7) и проверяем. Если позиция нечетная i%2 (вернет 1, если позиция 1, 3, 5…) и если значение элемента нечетное (array[i]%2 вернет 1, если значение нечетное), то увеличиваем счетчик на единицу. В конце распечатываем количество элементов q.

Это один вариант решения, давайте теперь посмотрим другой вариант.

 

Вариант решения №2. Использование filter()

Второй вариант заключается в том, что мы весь массив прогоняем с помощью метода filter() и проверяем, удовлетворяет ли значение элемента массива нашему условию:

var q = 0;
var array = [1, 9, 3, 7, 5, 0, 2];
/* x - значение элемента, y - позиция элемента в массиве */
array.filter(function(x, y) {
    if (y % 2) /* если позиция нечетная (1, 3, 5...) */
        if (x % 2) { /* если значение нечетно */
            q++;
        }
});
alert(q); // 2 элемента, удовлетворяющих условию

Данное решение выглядит немного элегантней и занимаем немного меньше места 🙂

Теперь разберем, как же работает метод filter().

 

Как работает filter()

Функция возвращает элементы массива, удовлетворяющие условию, которые указанны в функции обратного вызова.

array1.filter(callback[, thisArg]);

array1 — Обязательный. Объект массива.

callback — Обязательный. Метод filter вызывает функцию callback для каждого элемента массива по одному разу.

thisArg — Необязательный. Объект, на который будет ссылаться ключевое слово this в callback. Если аргумент thisArg не задан, то для значения this используется undefined.

 

Возвращаемые значения

После обработки возвращается новый массив, содержащий все значения, для которых функция обратного вызова возвращает значение true. Если функция вернула значение false для всех элементов массива, то длина нового полученного после обработки массива будет равна 0.

 

Функция callback в методе filter()

Функция callback принимает до 3-х параметров. Все параметры необязательные. Ниже приведены пояснения параметров.

function callback(value, index, array1) {
    // value - Значение элемента массива
    // index - Числовой индекс элемента массива
    // array1 - Объект массива, содержащий требуемый элемент.
}

 

Еще пример

Под конец приведу еще один маленький пример.

/* создание массива */
var arr = [5, "element", 10, "the", true];

// В result попадет массив, который содержит только 
// строки, которые содержатся в начальном массиве arr
var result = arr.filter(
    function (value) {
        return (typeof value === 'string');
    }
);

alert(result); /* Вывод: element, the */

 

Заключение

Вот и все. Мы разобрали, что делает функция filter() и решили с помощью нее простенькую задачу. Надеюсь, что все было понятно, а если нет — то спрашивайте в комментариях, вместе подумаем! 😉

Спасибо за внимание! Подписывайтесь на рассылку!

 

 

 

Автор статьи: Alex. Категория: JavaScript
Дата публикации: 25.05.2013