O método indexOf
(assim como o includes
) funciona com base num algoritmo de comparação similar ao utilizado pelo ===
.
Desse modo, dois objetos criados que não tiverem a mesma referência, mesmo que tenham estruturas iguais, serão considerados diferentes. Isso significa que você não pode utilizar métodos como indexOf
ou includes
para verificar se um determinado objeto existe dentro de um array. Eles simplesmente não funcional para o tipo de comparação estrutural que geralmente se faz necessária ao comparar objetos.
Nesse tipo de caso, o JavaScript não tem como prever como você deseja comparar dois objetos, afinal, se não é por referência, é pelo quê? Duas propriedades id
iguais (como no caso desta pergunta)? Ou todas as outras propriedades iguais? Quem determina isso é você.
O JavaScript provê, no protótipo de arrays, dois métodos, find
e findIndex
que, através de um callback, permitem comparações mais complexas a cada elemento do array. Então podemos utilizá-los.
O método find
irá executar o algoritmo de comparação especificado dentro do callback para cada elemento do array e retornará o primeiro elemento que faça o callback retornar true
. Do contrário, retorna undefined
.
const arr = [
{ id: 1, name: 'Foo' },
{ id: 2, name: 'Bar' },
{ id: 3, name: 'Baz' }
];
const needle = arr.find((currObj) => {
// Note que o callback retornará `true` se o objeto
// atual tiver propriedade `id` igual a 2.
return currObj.id === 2
});
console.log(needle); // { id: 2, name: 'Bar' }
E também (mais no sentido esperado pela pergunta) existe o findIndex
, que funciona similarmente ao find
, só que retorna o índice. No caso de não encontrar, retorna -1. Exemplo:
const arr = [
{ id: 1, name: 'Foo' },
{ id: 2, name: 'Bar' },
{ id: 3, name: 'Baz' }
];
const needleIndex = arr.findIndex((currObj) => {
// Note que o callback retornará `true` se o objeto
// atual tiver propriedade `id` igual a 2.
return currObj.id === 2
});
console.log(needleIndex); // 1
Claro que dá para utilizar um for
e fazer isso na mão, mas esses métodos são bem convenientes nesse caso (e têm a mesma complexidade assintótica). Você pode utilizar o filter
se quiser encontrar mais de um elemento do array que passe ao predicado fornecido. O find
, assim como findIndex
, retorna somente o primeiro elemento encontrado de acordo com a comparação especificada.
Não sugiro utilizar map
e posteriormente indexOf
já que isso percorreria o array duas vezes. Claro que continua sendo linear, mas me parece um desperdício. O findIndex
pode, se utilizar a notação curta de arrow functions, ser bastante expressivo:
arr.findIndex((obj) => obj.id === 2);