Filtro de matriz Javascript ()

O método JavaScript Array filter () retorna uma nova matriz com todos os elementos que passam no teste definido pela função fornecida.

A sintaxe do filter()método é:

 arr.filter(callback(element), thisArg)

Aqui, arr é um array.

filter () Parâmetros

O filter()método inclui:

  • retorno de chamada - a função de teste a ser executada em cada elemento da matriz; retorna truese o elemento passa no teste, senão false. Inclui:
    • elemento - o elemento atual que está sendo passado da matriz.
  • thisArg (opcional) - O valor a ser usado thisao executar o retorno de chamada. Por padrão, é undefined.

Valor de retorno do filtro ()

  • Retorna uma nova matriz apenas com os elementos que passaram no teste.

Notas :

  • filter() não altera a matriz original.
  • filter()não é executado callbackpara elementos da matriz sem valores.

Exemplo 1: Filtrando valores de Array

 const prices = (1800, 2000, null, 3000, 5000, "Thousand", 500, 8000) function checkPrice(element) ( return element> 2000 && !Number.isNaN(element); ) let filteredPrices = prices.filter(checkPrice); console.log(filteredPrices); // ( 3000, 5000, 8000 ) // using arrow function let newPrices = prices.filter((price) => (price> 2000 && !Number.isNaN(price))); console.log(newPrices); // ( 3000, 5000, 8000 )

Resultado

 (3.000, 5.000, 8.000) (3.000, 5.000, 8.000)

Aqui, todos os números menores ou iguais a 2.000 e todos os valores não numéricos são filtrados.

Exemplo 2: Pesquisando na Matriz

 const languages = ("JavaScript", "Python", "Ruby", "C", "C++", "Swift", "PHP", "Java"); function searchFor(arr, query) ( function condition(element) ( return element.toLowerCase().indexOf(query.toLowerCase()) !== -1; ) return arr.filter(condition); ) let newArr = searchFor(languages, "ja"); console.log(newArr); // ( 'JavaScript', 'Java' ) // using arrow function const searchArr = (arr, query) => arr.filter(element => element.toLowerCase().indexOf(query.toLowerCase()) !== -1); let newLanguages = searchArr(languages, "p"); console.log(newLanguages); // ( 'JavaScript', 'Python', 'PHP' )

Resultado

 ('JavaScript', 'Java') ('JavaScript', 'Python', 'PHP')

Aqui, elemento e consulta são convertidos em minúsculas, e o método indexOf () é usado para verificar se a consulta está presente dentro do elemento. Os elementos que não passam neste teste são filtrados.

Leitura recomendada: JavaScript Array map ()

Artigos interessantes...