Array.prototype.filter()

Метод filter() створює новий масив з всіма елементами, що пройшли тест функцією, яка була передана.

function isBigEnough(value) {
  return value >= 10;
}

var filtered = [12, 5, 8, 130, 44].filter(isBigEnough);
// відфільтрований масив [12, 130, 44]

Синтакс

var new_array = arr.filter(callback[, thisArg])

Параметри

callback

Функція є предикатом, який тестує кожен елемент масиву. Повертає true щоб зберегти елемент і false щоб видалити, приймає три аргументи:

element

Поточний елемент, який обробляється в масиві.

index

Індекс поточного елемента, який обробляється в масиві.

array

Масив, на якому був викликаний фільтр.

thisArg

Необов'язковий. Значення, яке використовується як this коли виконується callback.

Значення, яке повертається

Новий масив з елементами, які пройшли тест.

Опис

filter() викликає передану функцію callback один раз для кожного елемента масиву, і створює новий масив з всіма значеннями для яких функція callback повертає значення яке еквівалентне true. callback викликається лише для індексів масиву, які мають присвоєне значення; вона не викликається для індексів, котрі були видалені або котрим ніколи не присвоювалися значення. Масив елементів, котрі не пройшли тест функцією callback просто пропускаються, і не включаються в новий масив.

функція callback викликається з трьома аргументами:

1. значення елемента
2. індекс елемента
3. масив по якому робиться обхід

Якщо параметр thisArg переданий в фільтр, то він буде переданий в функцію callback, коли вона буде викликана, і буде використовуватися як значення this. В іншому випадку буде передано значення undefined як його значення this. Значення this зрештою видиме для функції callback і визначається відповідно до звичайних правил для визначення this яке видиме функцією.

filter() не змінює масив, на якому він викликається.

Діапазон елементів, які обробляються методом filter() встановлюється перед першим виконанням функції callback. Елементи, які додаються в масив після того, як метод filter() був викликаний, не будуть обходитися функцією callback. Якщо існуючі елементи масиву змінилися, то їхні значення, які передаються в функцію callback будуть значеннями на момент обходу їх методом filter(); якщо існуючі елементи масиву видалили, то метод filter() обходити їх не буде.

Приклади

Фільтрація всіх малих значень

Наступний приклад використовує метод filter(), щоб відфільтрувати всі елементи масиву, які нижче 10.

function isBigEnough(value) {
  return value >= 10;
}

var filtered = [12, 5, 8, 130, 44].filter(isBigEnough);
// відфільтрований масив [12, 130, 44]

Фільтрація невалідних JSON елементів

Наснупний приклад використовує метод filter(), щоб відфільтрувати всі json елементи, в яких не нульові числові id.

var arr = [
  { id: 15 },
  { id: -1 },
  { id: 0 },
  { id: 3 },
  { id: 12.2 },
  { },
  { id: null },
  { id: NaN },
  { id: 'undefined' }
];

var invalidEntries = 0;

function isNumber(obj) {
  return obj!== undefined && typeof(obj) === 'number' && !isNaN(obj);
}

function filterByID(item) {
  if (isNumber(item.id)) {
    return true;
  } 
  invalidEntries++;
  return false; 
}

var arrByID = arr.filter(filterByID);

console.log('Filtered Array\n', arrByID); 
// Відфільтрований масив
// [{ id: 15 }, { id: -1 }, { id: 0 }, { id: 3 }, { id: 12.2 }]

console.log('Number of Invalid Entries = ', invalidEntries); 
// Кількість невалідних елементів = 4

Поліфіл

Метод filter() був доданий до стандарту ECMA-262 в 5-й версії; як такий він може бути не реалізований в всіх реалізаціях стандарту. Ви можете обійти цю проблему, вставивши наступний код на початку ваших скриптів, що дозволить використовувати метод filter() в ECMA-262 реалізаціях, які початково не підтримували його. Цей алгоритм є саме тим, що зазначений у ECMA-262, 5-ї версії, за умови, що fn.call прирівнюється до первинного значення Function.prototype.call(), і що Array.prototype.push() має своє первинне значення.

if (!Array.prototype.filter) {
  Array.prototype.filter = function(fun/*, thisArg*/) {
    'use strict';

    if (this === void 0 || this === null) {
      throw new TypeError();
    }

    var t = Object(this);
    var len = t.length >>> 0;
    if (typeof fun !== 'function') {
      throw new TypeError();
    }

    var res = [];
    var thisArg = arguments.length >= 2 ? arguments[1] : void 0;
    for (var i = 0; i < len; i++) {
      if (i in t) {
        var val = t[i];

        // Примітка: Технічно, тут повинен бути Object.defineProperty на
        //           наступний індекс, оскільки push може залежати від
        //           полів на Object.prototype і Array.prototype. Але цей
        //           метод новий, і колізії можуть бути рідкісним явищем,
        //           тому використовуємо більш сумісну альтернативу.
        if (fun.call(thisArg, val, i, t)) {
          res.push(val);
        }
      }
    }

    return res;
  };
}

Специфікації

Сумісність з браузерами

Дивитися також

• Array.prototype.forEach()
• Array.prototype.every()
• Array.prototype.some()
• Array.prototype.reduce()