Filtre de tableau Javascript ()

La méthode JavaScript Array filter () renvoie un nouveau tableau avec tous les éléments qui passent le test défini par la fonction donnée.

La syntaxe de la filter()méthode est:

 arr.filter(callback(element), thisArg)

Ici, arr est un tableau.

filter () Paramètres

La filter()méthode prend en compte:

  • callback - La fonction de test à exécuter sur chaque élément du tableau; retourne truesi l'élément réussit le test, sinon false. Il prend en:
    • element - L'élément actuel transmis depuis le tableau.
  • thisArg (facultatif) - La valeur à utiliser comme thislors de l'exécution du rappel. Par défaut, c'est le cas undefined.

Valeur renvoyée par le filtre ()

  • Renvoie un nouveau tableau avec uniquement les éléments qui ont réussi le test.

Remarques :

  • filter() ne modifie pas la matrice d'origine.
  • filter()ne s'exécute pas callbackpour les éléments de tableau sans valeurs.

Exemple 1: filtrage des valeurs 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 )

Production

 (3000, 5000, 8000) (3000, 5000, 8000)

Ici, tous les nombres inférieurs ou égaux à 2000 et toutes les valeurs non numériques sont filtrés.

Exemple 2: Recherche dans un tableau

 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' )

Production

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

Ici, l'élément et la requête sont tous deux convertis en minuscules, et la méthode indexOf () est utilisée pour vérifier si la requête est présente à l'intérieur de l'élément. Les éléments qui ne passent pas ce test sont filtrés.

Lecture recommandée: JavaScript Array map ()

Articles intéressants...