Array.prototype.filter()

Il metodo filter() crea un nuovo array contentente tutti gli elementi che passano il test implementato dalla funzione. 

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

var filtered = [12, 5, 8, 130, 44].filter(isBigEnough);
// filtered is [12, 130, 44]

Sintassi

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

Parametri

callback

Funzione predicato per testare ciascun elemento dell'array. Restituisce true se l'elemento va mantenuto, false altrimenti. Essa prende in input tre argomenti:

element

L'elemento corrente nell'array processato.

index

L' indice dell'elemento corrente processato nell'array.

array

l'array su cui filter è stato chiamato.

thisArg

Opzionale. Valore da usare come this quando si esegue callback.

Valore restituito

Un nuovo array con gli elementi che hanno passato il test.

Descrizione

filter() chiama funzione ricorsiva (callback) fornita una volta per ciascun elemento dell'array e crea un nuovo array con tutti quei valori in cui la callback ha restituito un valore true.. callback viene invocata solo per gli indici dell'array a cui sono associati dei valori; non viene invocata per inidici in cui sono stati cancellati i valori o in cui non sono stati definiti valori. Gli elementi dell'array che non superano il test vengono semplicemente ignorati, non venendo così inseriti nel nuovo array.

callback viene invocata con tre argomenti:

1. il valore dell'elemento
2. l'indice dell'elemento
3. l' Array oggetto da passare

Se viene fornito a filter un parametro thisArg , questo verrà passato a sua volta a callback quando verrà invocata per usarlo come valore di this . Altrimenti verrà passato un valore undefined per essere usato come valore di this. Il valore  this osservabile in definitiva dalla funzione callback viene scelto seguendo le usuali regole di determinazione dei this visti da una funzione.

filter() non muta l'array sul quale viene chiamata.

La gamma di element processati da filter() viene impostata prima della invocazione della callback. Gli elementi che vengono mesi nell'array da filtrare dopo l'invocazione di filter() non verranno esaminati dalla callback. Se ci sono elementi dell'array da fitrare i cui valori vengono cambiati o vengono cancellati dopo la applicazione di filter() ,  questi nel tempo di chamata di filter() verranno testati dalla  callback nello stato previo alla loro modifica. Elementi cancellati prima della applicazione di  filter()  non vengono visitati.

Esempi

Filtrare tutti i piccoli valori

Il seguente esempio usa filter() per realizzare un array filtrato che non contenga elementi di valore inferiore a 10.

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

var filtered = [12, 5, 8, 130, 44].filter(isBigEnough);
// filtered is [12, 130, 44]

Filtrare entrate non valide in JSON

Il sequente esempio di utilizzo di filter() crea un json filtrato di elementi con valido  id numerico.

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); 
// Array filtrato
// [{ id: 15 }, { id: -1 }, { id: 0 }, { id: 3 }, { id: 12.2 }]

console.log('Quantità di entrate non valide = ', invalidEntries); 
// Quantità di entrate non valide = 4

Polyfill

filter() è stato aggiunto allo standard ECMA-262 nella quinta edizione; potrebbe essere non presente in tutte le implementazioni dello standard. Puoi sempre inserire il seguente codice nei tuoi script per poter usare filter() nelle implementazioni ECMA-262 che non lo supportanto nativamente. Questo algoritmo è esattamente quello nella specifica ECMA-262, quinta edizione, assumendo che  fn.call valuti il valore originale di  Function.prototype.call(),e che Array.prototype.push() abbia il suo valore originale.

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];

        // NOTE: Technically this should Object.defineProperty at
        //       the next index, as push can be affected by
        //       properties on Object.prototype and Array.prototype.
        //       But that method's new, and collisions should be
        //       rare, so use the more-compatible alternative.
        if (fun.call(thisArg, val, i, t)) {
          res.push(val);
        }
      }
    }

    return res;
  };
}

Specificazioni

Compatibilità Browser

Vedi anche

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