JavaScript - Diferenças entre o Find e o Filter

Introdução

Alguns array methods do JavaScript, por executarem basicamente a mesma função, mas de modos diferentes, podem acabar te confundido.

Esse pode ser o caso do find e do filter, mas nesse post eu pretendo, de forma rápida, acabar com todas as suas dúvidas.

O problema

Para simular uma situação real de pesquisa, vamos utilizar esse array de linguagens de programação, onde desejamos pesquisar uma linguaguem:

const languages = [
    {
        name: 'JavaScript'
        year: 1995,
    },
    {
        name: 'Dart',
        year: 2011,
    }
    {
        name: 'Go',
        year: 2009,
    }
]

Array.prototype.find()

O find irá percorrer o array e retornar o primeiro item que corresponda à uma condição, ou seja, seu uso é recomendado para uma busca de um único elemento.

const goLanguage = languages.find(language => language.name === "Go")

Array.prototype.filter()

O filter irá percorrer o array e, diferentemente do find, não irá parar a execução ao encontrar um item que corresponda à condição. Ele irá percorrer todo o array, e caso encontre mais de um valor que corresponda a condição, irá retorná-lo também.

A sua sintaxe é semelhante a do find:

const goLanguage = languages.filter(language => language.name === "Go")

Conclusão

Espero ter acabado de vez com a confusão ao utilizarmos um dos métodos. Então, se desejar pesquisar apenas um elemento, vá de find. Caso contrário, use o filter;

Se surgirem dúvidas ou sugestões, não deixem de mandar aqui nos comentários!