1 min de leitura ·

O método find e a busca ao modo CTRL + F em JavaScript

Qual é a melhor ferramenta do mundo?

Claro que é o CTRL + F. E se você conhece esse atalho, fica muito fácil entender o find em Javascript, porque ele faz a mesma coisa.

O find do encontra o primeiro item dentro de uma array que atende a um ou mais critérios e retorna esse item.

exemplo simples de find em javascript

const numbers = [ 0, 3, 1, 6, 3, 7, 5 ];

const result = numbers.find(function(number) {
  if (number > 5) {
    return true;
  } else {
    return false;
  }
});

console.log(result); // 6

Fiz um post completo no meu blog abordando váaarias coisas sobre esse método:

Função callback
Retorno da função callback
Quando ele pára de executar
Um pouco sobre coerção de tipos
Parâmetros da função callback
- item
- index
- array
Como saber o momento de usar o find (perguntas que você deve se fazer)

Vou deixar o link do blog aqui na fontes.

Pode deixar um comentário dizendo o que achou 😊

Fonte: https://demenezes.dev/posts/find-javascript-array/

kht

11 meses atrás

Complementando, tem um caso em que o uso de find pode ser ambíguo. Como ele retorna undefined caso não seja encontrado nenhum elemento, o que acontece se o array contém undefined?

Exemplo:

var array = [1, 2, undefined];
var result = array.find(n => isNaN(n));
console.log(result); // undefined
 
array = [1, 2, 3];
result = array.find(n => isNaN(n));
console.log(result); // undefined

Neste caso eu não tenho como diferenciar um caso não encontrado de um no qual o array de fato contém undefined.

Nesta situação, uma opção é usar findIndex, que retorna o índice do elemento, ou -1 caso nenhum seja encontrado. Veja a diferença:

var array = [1, 2, undefined];
var result = array.findIndex(n => isNaN(n));
console.log(result); // 2
 
array = [1, 2, 3];
result = array.findIndex(n => isNaN(n));
console.log(result); // -1

deMenezes

Autor

11 meses atrás

Interessante. Acho meio tenso em uma aplicação ter undefined em uma array, não me parece algo comum.

Mas para resolver eu faria o seguinte, se descobrisse isso em build time, eu usaria um filter antes do find para eliminar valores false:

var array = [1, 2, undefined];
var result = array.filter(Boolean).find(n => isNaN(n));
console.log(result); // undefined
 
array = [1, 2, 3];
var result = array.filter(Boolean).find(n => isNaN(n));
console.log(result); // undefined

O resultado nas duas situações continua sendo undefined, mas agora tenho certeza que o motivo é:

"Nada foi encontrado"

E não:

"Um undefined foi encontrado"

O problema que vejo de usar findIndex é que ele retorna o índice do item, e o find retorna o próprio item.

Nesse caso para obter o resultado verdadeiro teria que verificar se o resultado é -1. E só se isso for falso, criar a variável:

// var array = [1, 2, undefined];
var array = [1, 2, 3];
var index = array.findIndex(n => isNaN(n));

if (index === -1) {
    throw new Error('Item não encontrado')
}

var result = array[index];
console.log(result);

Mas é uma questão legal, daquelas que o JS adora fazer auhsuahsuahs