Cómo obtener el índice de un elemento de un array en JavaScript

En este tutorial vamos a ver cómo puedes obtener el índice de un elemento de un array usando JavaScript. Se trata de una tarea muy común que resulta útil cuando conoces el valor de un elemento pero quieres obtener su posición en el interior de un array.

También podría darse el caso de que no sepas si el valor del elemento está o no en el array. En ambos casos, siempre que el elemento que buscas sea un valor primitivo y no un objeto, la solución es el método indexOf, disponible en los arrays de JavaScript. Un tipo primitivo es un valor como un número o una cadena de texto. En caso de tratarse de un objeto, tendrías que usar el método findIndex.

Índice de un tipo primitivo

A continuación vamos a ver cómo usar el método indexOf, que nos devolverá el índice del elemento que le pasemos como parámetro si el elemento está en el array, o -1 en caso contrario.

En el siguiente ejemplo obtenemos el índice del valor 'manzana' usando el método indexOf en el array frutas:

const frutas = ['naranja', 'manzana', 'platano'];

const indice = frutas.indexOf('manzana'); // 1

Tal y como ves, hemos obtenido el índice como resultado, cuyo valor es 1 a pesar de tratarse del segundo elemento del array, ya que los índices comienzan por 0.

En este otro ejemplo, buscamos un valor en el array que no existe, por lo que obtenemos -1 como resultado:

const frutas = ['naranja', 'manzana', 'platano'];

const indice = frutas.indexOf('fresa'); 

console.log(indice); // -1

Índice de un objeto

En caso de que queramos obtener el índice de un objeto, no podríamos usar el método indexOf, ya que los objetos no son más que una referencia con varias propiedades. Los objetos se comparan por referencia, mientras que los tipos primitivos se comparan por valor, por lo que nunca encontraremos el objeto en el array usando este método.

Sin embargo, podemos usar el método findIndex, que acepta una función como parámetro que se ejecutará con cada uno de sus elementos. Esta función se ejecutará con el cada elemento y cada índice, que el propio método findIndex se encargará de rellenar en cada iteración.

Lo que vamos a hacer en el siguiente ejemplo es buscar si el el valor de la propiedad nombre de los objetos del array se corresponde con el valor que conocemos. Si encontramos el valor devolvemos true. De lo contrario continuamos la ejecución:

const frutas = [
  { nombre: 'naranja', forma: 'redonda' },
  { nombre: 'manzana', forma: 'redonda' },
  { nombre: 'platano', forma: 'alargada' },
];

const indice = frutas.findIndex((elemento, indice) => {
  if (elemento.nombre === 'manzana') {
    return true;
  }
});

console.log(indice); // 1

Si quieres más información acerca de cómo gestionar arrays, consulta estos tutoriales: