Maison  >  Article  >  interface Web  >  Quelle est la différence entre rechercher et filtrer dans Es6

Quelle est la différence entre rechercher et filtrer dans Es6

WBOY
WBOYoriginal
2022-05-05 17:07:023495parcourir

La différence entre find et filter dans es6 : 1. Lors de la recherche de contenu qui répond aux conditions dans le tableau sans modifier le tableau, le résultat renvoyé par la méthode find est un objet et le résultat renvoyé par la méthode filter est un array; 2. Si aucune valeur ne satisfait la fonction Test, la méthode find renvoie undefined et la méthode filter renvoie un tableau vide.

Quelle est la différence entre rechercher et filtrer dans Es6

L'environnement d'exploitation de ce tutoriel : système Windows 10, ECMAScript version 6.0, ordinateur Dell G3.

Quelle est la différence entre find et filter dans es6

1. Find et filter sont deux méthodes qui ne modifient pas le tableau d'origine. Elles recherchent toutes deux du contenu qualifié dans le tableau sans modifier le tableau. un objet, le filtre renvoie un tableau.

L'exemple est le suivant :

const list = [{'name':'1',index:1},{'name':'2'},{'name':'1'}]
let list2 = list.find(i=>i.name==='1') 
let list3 = list.filter(i=>i.name==='1')
console.log(list); [ { name: '1', index: 1 }, { name: '2' }, { name: '1' } ]
console.log(list2); { name: '1', index: 1 }
console.log(list3);[ { name: '1', index: 1 }, { name: '1' } ]

find ne trouve que le premier résultat qui remplit les conditions. Dans l'exemple, il renvoie directement un objet au lieu d'un tableau ! , et filter renvoie tous les résultats toujours sous forme de tableaux.

Remarque : une fois que find() a trouvé le premier élément, il ne traversera pas les éléments suivants, donc s'il y a deux éléments identiques dans le tableau, il ne trouvera que le premier et le second ne sera plus parcouru. .

2. En résumé, l'efficacité des requêtes de recherche est plus élevée, donc si les données du tableau sont uniques, il est préférable d'utiliser find

find()

La méthode ES6 find() renvoie la première qui passe le fonction de test La valeur de l'élément. Si aucune valeur ne satisfait à la fonction de test, undefined est renvoyé.

Syntaxe

Fonctions fléchées utilisées dans la syntaxe suivante. La méthode

find((element) => { /* ... */ } )
find((element, index) => { /* ... */ } )
find((element, index, array) => { /* ... */ } )

filter()

filter() crée un nouveau tableau contenant tous les éléments qui réussissent la fonction de test. Si aucun élément ne satisfait à la fonction de test, un tableau vide est renvoyé.

Grammar

filter((element) => { /* ... */ } )
filter((element, index) => { /* ... */ } )
filter((element, index, array) => { /* ... */ } )

Points communs

Fonctions d'ordre supérieur : Les deux fonctions sont des fonctions d'ordre supérieur.

Différences

1. Renvoyez le premier élément via une fonction de test

find().

filter() renvoie un nouveau tableau contenant tous les éléments qui ont réussi la fonction de test.

2. Si aucune valeur ne satisfait à la fonction de test

find() renvoie undefined ;

filter() renvoie un tableau vide

[Recommandations associées : tutoriel vidéo javascript, front-end web]

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn